PDA

View Full Version : Change TD text color on TD onmouseover


nurseryboy
11-06-2002, 03:06 PM
LoL, I guess the subject sort-of speaks for the question.
But here it is anyhow:
How do I change the color of a link in a TD when the TD gets mouseovered? What is happening is, the TD turns a color that makes the text really hard to read, but I want the origional text color when the mouse itsnt over the TD.
Thanks for the help,

Matthew

requestcode
11-06-2002, 04:20 PM
Here is one way you can do it:
<html>
<head>
<title>Table Cell and Link Color Change</title>
<SCRIPT LANGUAGE="JavaScript">
function chgtxt(obj,linkid,cellcolor,linkcolor)
{
if(document.getElementById) // IE5+ and NS6+ only
{
document.getElementById(obj.id).style.backgroundColor=cellcolor
document.getElementById(linkid).style.color=linkcolor
}
}
</SCRIPT>
<STYLE>
.tabClass {background-color:blue;}
.lnkClass {color:white;font-weight:bold;font-size:10pt;font-face:Arial;text-decoration:none}
</STYLE>
</head>
<body>
<TABLE ALIGN="center" BORDER="1" WIDTH="300" HEIGHT="20" CELLSPACING="0" CELLPADDING="0">
<TR>
<TD ID="td1" onClick="location.href='page1.html'" CLASS="tabClass" ALIGN="center" VALIGN="middle" onMouseOver="chgtxt(this,'link0','white','blue')" onMouseOut="chgtxt(this,'link0','blue','white')">
<A HREF="page1.html" ID="link0" CLASS="lnkClass">Click Me</A>
</TD>
<TD ID="td2" onClick="location.href='page2.html'" CLASS="tabClass" ALIGN="center" VALIGN="middle" onMouseOver="chgtxt(this,'link1','white','blue')" onMouseOut="chgtxt(this,'link1','blue','white')">
<A HREF="page2.html" ID="link1" CLASS="lnkClass">Click Me</A>
</TD>
</TR>
</TABLE>
</body>
</html>

this will work in NS6+ IE5+

nurseryboy
11-06-2002, 05:44 PM
Good deal!
Thanks a lot, it looks a lot better.

Matthew