I'm having trouble making my rollover change back to its normal state when using a css drop down menu. everything works except the mouseover state remains when you take your mouse off of the button.

<The button in question>

<div style="position:absolute;top:465px;left:72px;width:146px;height:34px;">
<a href="achievement.html"><img src="images/normal/SacredHeart-Redesign_10.jpg" alt="About Our School" width="146" height="34" border="0" id="aboutbutton" onmouseover="changeImages('aboutbutton','images/over/SacredHeart-Redesign_10.jpg');dropdownmenu(this, event, 'aboutmenu')" onmouseout="changeImages('aboutbutton','images/normal/SacredHeart-Redesign_10.jpg')" /></a></div>

<The CSS menu in question>

<div id="aboutmenu" class="anylinkcss">
<a href="http://www.dynamicdrive.com/">Dynamic Drive</a>
<a href="http://www.cssdrive.com">CSS Drive</a>
<a href="http://www.javascriptkit.com">JavaScript Kit</a>
<a href="http://www.codingforums.com">Coding Forums</a>
<a href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a>
</div>