Wed, 2004-09-01 03:04
I'm trying to get the background image of a table cell to change/rollover when you mouse over a link. This code works in IE, but in Firefox/Mozilla/Netscape it says that it can't find the object "changebg", so is there another way to pass the object's name?
I know this can be done by calling onmouseover/out from the TD tag but I have to get it working from a link (there will be multiple links each with a different rollover image in the TD).
The sample webpage:
http://www.cuberis.com/rollover/tdrollover2.html
Code:
<html>
<head>
<title>Change Test</title>
<style type="text/css">
td.image {
background: url(intside1.jpg);
}
td.image2 {
background: url(intside2.jpg);
}
</style>
</head>
<body>
<table width="100" height="100">
<tr>
<td id="changebg" name="changebg">
<a href="#" onmouseover="changebg.className='image2'" onmouseout="changebg.className='image'">Change</a>
</td>
</tr>
</table>
</body>
</html>
Thanks!
Wed, 2004-09-01 04:13
#1
cell background rollover can't find object?
I don't know why that didn't work, but I always use this.className='whatever' instead of refering to an element's id. This seems to work on Netscape, Mozilla, etc. Good luck! - Jen