Ok, my website's navigation bar has an image () to open a drop down window. The problem is if you go over the image/dropdown bar fast enough they both disapear. Heres my code (the useful stuff, the rest you can view source for):
Code:
<script> 
function expandCollapse() {
for (var i=0; i<expandCollapse.arguments.length; i++) {
var element = document.getElementById(expandCollapse.arguments[i]);
element.style.display = (element.style.display == "none") ? "block" : "none";
}
}
</script>
<span style="left:2; position:relative; text-decoration:none; font-size:0.8em;"> 
<b> <a href="http://www.mwnciau.co.uk" style="text-decoration:none; font-size:1.2em;">Mwnciau.co.uk</a><br>
<a href="http://games.mwnciau.co.uk" style="text-decoration:none">Games home</a>
<a id="gamesp" onMouseOver="expandCollapse('gamesdiv', 'gamesp')"> <img src="open.png"> </a>
<div id="gamesdiv" 
style="position:relative; display:none; left:75; top:-12; background-color: #FFFF99; cursor:default; padding-left:2; width: 100;" 
onMouseOut="expandCollapse('gamesdiv'); document.getElementById('gamesp').style.display = 'inline';">
<a href="http://games.mwnciau.co.uk/flash.php">Flash Games</a></div>
</b>
</span>
I'm a newbie to javascript and can't figure out a solution

Thanks for any help/contribution.