«

IE creates an object of every ID'd HTML tag (so it appears), and each
object sets a property for any parameter I set in the tag. For example,
my HTML might be: <td id='cell1' background='myimg.jpg' width='30'> ...
</td> which IE will use to create a Javascript object called 'cell1'
with properties of background and width, like so:
cell1.background would have a value of 'myimg.jpg' and cell1.width would
have a value of 30.

I can change the width of the cell in my Javascript function using:
document.getElementById('cell1').width = 25;
and I can change the background using
document.getElementById('cell1').background = "yourimg.jpg";

But this doesn't work in all browsers because they (FireFox, for
example) doesn't create an object property (such as "width" and
"background") for each tag with an ID.

How do I get around this using non-IE browsers? I want my Javascript to
be able to change the background image of a table cell. It works in IE,
but not FireFox. I haven't tried others yet.

Mark

Mark said the following on 7/29/2006 10:19 AM:
> IE creates an object of every ID'd HTML tag (so it appears), and each
> object sets a property for any parameter I set in the tag. For example,
> my HTML might be: <td id='cell1' background='myimg.jpg' width='30'> ...
> </td> which IE will use to create a Javascript object called 'cell1'
> with properties of background and width, like so:
> cell1.background would have a value of 'myimg.jpg' and cell1.width would
> have a value of 30.

Welcome to the quirks and stupidity of IE.

> I can change the width of the cell in my Javascript function using:
> document.getElementById('cell1').width = 25;
> and I can change the background using
> document.getElementById('cell1').background = "yourimg.jpg";
>
> But this doesn't work in all browsers because they (FireFox, for
> example) doesn't create an object property (such as "width" and
> "background") for each tag with an ID.

No browser does it other than IE, that I know of.

> How do I get around this using non-IE browsers? I want my Javascript to
> be able to change the background image of a table cell. It works in IE,
> but not FireFox. I haven't tried others yet.

Use CSS and then change it's style properties:

<td id="cell1" style="background-image:myimg.jpg;width:30px">

document.getElementById('cell1').style.backgroundI mage = 'newImage.jpg';
document.getElementById('cell1').style.width = '22px';

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

> Use CSS and then change it's style properties:
>
> <td id="cell1" style="background-image:myimg.jpg;width:30px">
>
> document.getElementById('cell1').style.backgroundI mage = 'newImage.jpg';
> document.getElementById('cell1').style.width = '22px';
>
Thanks! This does the trick!

Mark