Cant Get Background Image to change in IE 1

[countdrak]

I have a simple script where I set a background image for a <TD>

<td id="td1" style="background-image:url(images/tasd.png); width:171px; height:32px; background-repeat:no-repeat" class="title"><a onClick="javascript:changebg('td1');">Click Me </a></td>

I wrote a simple script to change the background of this td when I pass the ID, BUT IT DOESNT WORK IN IE!

	function changebg(x)
	{	

	 	var newImage = 'url(images/tasd_over.png)';
		
		document.getElementById(x).style.backgroundImage = newImage;
		document.getElementById(x).style.width = '171px'; 
		document.getElementById(x).style.height = '32px'; 
		
}

This works in FF but not in IE! Is it possible to make this work in IE? Thank you!

 

[BillyRayPreachersSon]

Two things to try:

1. Remove the "javascript:" prefix - it isn't necessary when using "onclick".

2. Put an alert in the function to see if it getting called at all. If it isn't that's most likely your problem.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[countdrak]

The javascript is called! The problem is the old background disappears , I new one never comes up..

Again the problem is only in IE. In FF everything works fine.

Thanks.

 

[BillyRayPreachersSon]

Try putting a fully-qualified path instead of a relative path.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[countdrak]

Thanks , But didnt work!

 

[trollacious]

What do you get from the following?

alert(document.getElementById(x).style.backgroundImage);
document.getElementById(x).style.backgroundImage = newImage;
alert(document.getElementById(x).style.backgroundImage);

Lee

 

[countdrak]

I have no clue what happened but it started working!


alert(document.getElementById(x).style.backgroundImage);
document.getElementById(x).style.backgroundImage = newImage;
alert(document.getElementById(x).style.backgroundImage);

I just did the above. I got url(images/tasd.png) on the first alert and url(images/tasd_over.png) on the second alert and the background changed! Thank you.

 

[trollacious]

How are you calling the function?

Lee

 

[countdrak]

<a onClick="changebg('td1');">Click Me</a>