<td> Css Not Reacting To Rollover

[therschbach]

I have a js rollover set up for a <td> to change the background color and the text color, but neither is happening. Now, this <table> is already part of a rollover...it is set to visibility:visible onMouseOver the container div. I'm not sure if this is causing a conflict. The <td> is the first one with the onMouseOver & onMouseOut. Any ideas?HTML:

<div id="authorfield" onMouseOver="reveal('author')" onMouseOut="hide('author')">  <img id="author" src="pictures/button2.jpg" alt="Author">	<div id="authormenu">	  <table id="authortable">		<tr>		  <td onMouseOver="menuButtonOn" onMouseOut="menuButtonOff" ><a id="about" onClick="ajaxFunction(this.id)">About Me</a></td>		</tr>		<tr>		  <td><a id="findstodate" onClick="ajaxFunction(this.id)">Finds</a></td>		</tr>		<tr>		  <td><a id="equipment" onClick="ajaxFunction(this.id)">Equipment</a></td>		</tr>	  </table>	</div></div>

java script:

function reveal(buttonID){document.getElementById(buttonID+"menu").style.visibility = "visible"; }function hide(buttonID){document.getElementById(buttonID+"menu").style.visibility = "hidden"; }function menuButtonOn(){this.style.background = "#e2cda1";this.style.color = "white";}function menuButtonOff(){this.style.background = "#674d3d";this.style.color = "black";}

[jesh]

Change your HTML to:

<td onmouseover="menuButtonOn(this);" onmouseout="menuButtonOff(this);">

And your javascript to:

function menuButtonOn(el){el.style.background = "#e2cda1";el.style.color = "white";}function menuButtonOff(el){el.style.background = "#674d3d";el.style.color = "black";}

[jeffman]

never mind

[jesh]

never mind

Within the same minute even!

[therschbach]

Holy crap it works. That was a quicky. Thanks m8!