PDA

Click to See Complete Forum and Search --> : change background colour

Webskater
03-14-2003, 08:45 AM
How can you change the background colour of a cell when you mouseover it? Thanks.
requestcode
03-14-2003, 09:15 AM
Here is an example that changes the color and text in a table cell.
<html>
<head>
<title>Table Cell Color Change</title>
<script language="JavaScript">
function chgtabcolor(name,bcolor,txt)
{
if(document.getElementById)
{
elm=document.getElementById(name.id)
elm.style.backgroundColor=bcolor
var newText = document.createTextNode(txt)
elm.replaceChild(newText, elm.childNodes[0])
}
}
</script>
</head>
<body>
<table align="center" border="1" width="200" height="120" cellspacing="0" cellpadding="0">
<tr>
<td id="cell1" align="center" valign="middle" width="66" height="20" onmouseover="chgtabcolor(this,'lightgreen','World')" onmouseout="chgtabcolor(this,'white','Hello')"> Hello </td>
<td id="cell2" align="center" valign="middle" width="66" height="20" onmouseover="chgtabcolor(this,'red','World')" onmouseout="chgtabcolor(this,'white','Hello')"> Hello </td>
<td id="cell3" align="center" valign="middle" width="66" height="20" onmouseover="chgtabcolor(this,'lightyellow','World')" onmouseout="chgtabcolor(this,'white','Hello')">Hello</td>
</tr>
<tr>
<td id="cell4" align="center" valign="middle" width="66" height="20" onmouseover="chgtabcolor(this,'lightgreen','World')" onmouseout="chgtabcolor(this,'white','Hello')"> Hello </td>
<td id="cell5" align="center" valign="middle" width="66" height="20" onmouseover="chgtabcolor(this,'red','World')" onmouseout="chgtabcolor(this,'white','Hello')"> Hello </td>
<td id="cell6" align="center" valign="middle" width="66" height="20" onmouseover="chgtabcolor(this,'lightyellow','World')" onmouseout="chgtabcolor(this,'white','Hello')">Hello</td>
</tr>
</table>
</body>
</html>
Webskater
03-14-2003, 02:49 PM
Thanks for your reply. Will it work in Netscape? Also, what modifications would I need to make to get it to change the image used as the background for a cell? Again, thanks.