Popup Bars Arent Staying Up

[R4nk3d]

So i have a decent javascript uhh... script that im using to create a popout menu bar at http://152.160.5.14 but when u hover over the menu button, the menu pops out, but when u rollover that, it  closes because of the timer. I dont know why it wont stay open... Can i get some help? Heres the javascript:

 

var nav_timer = 0;
function loadGroup(id)
{
	document.getElementById(id).style.visibility = "visible";
	cancel_timer('nav_timer');
}
function unloadGroup(id)
{
	document.getElementById(id).style.visibility = "hidden";
}
function cancel_timer(timer)
{
	if(timer)
	{
		window.clearTimeout(timer);
		timer = null;
	}
}
function setClosingTime(id)
{
	nav_timer = window.setTimeout('unloadGroup(\''+id+'\')', 500);
}

 

and heres the html for one of the buttons:

<style type="text/css">
#nav_menu_1 {
				visibility: hidden;
			}
			#nav_menu_1 a {
				position:relative;
				width:auto;
				display:block;
				margin: 0;
				padding:0;
			}</style><li>
<a href="javascript:void(0);" onmouseover="loadGroup('nav_menu_1');" onmouseout="setClosingTime('nav_menu_1');" >
<img src="/images/group_bar.php?text=Wireless Washtenaw" alt="Wireless Washtenaw" /></a>
<div id="nav_menu_1" onmouseover="cancel_timer('nav_timer');" onmouseout="setClosingTime('nav_menu_1');" >
<a href="/index.php?id=7&title=Prices" ><img src="/images/group_link_bar.php?text=Prices" alt="test" /></a>
<a href="/index.php?id=6&title=Where's It Available?" ><img src="/images/group_link_bar.php?text=Where's It Available?" alt="test" /></a>
<a href="/index.php?id=1&title=Wireless Washtenaw" ><img src="/images/group_link_bar.php?text=Wireless Washtenaw" alt="test" /></a>
</div></li>