[jQuery] Jquery for mouseover menus
I am doing a basic mouseover menu. I am using hover to swap the image
inside an a tag. The problem is when the mouse moves moderatly fast
the jQuery does not catch that the mouse has moved out.
My js code:
<script type="text/javascript">
$(document).ready(function() {
$("div#nav a").hover(
function () {
$(this).html('<img src="images/navPlaceHolderRed.gif">');
},
function () {
$(this).html('<img src="images/navPlaceHolder.gif">');
}
);
});
</script>
and my html:
<div id="nav">
<a href="" id="homeLink">Home</a>
<a href=""><img src="images/navPlaceHolder.gif"></a>
<a href=""><img src="images/navPlaceHolder.gif"></a>
<a href=""><img src="images/navPlaceHolder.gif"></a>
<a href=""><img src="images/navPlaceHolder.gif"></a>
<a href=""><img src="images/navPlaceHolder.gif"></a>
</div><!-- end of nav div -->