<script language="javascript" type="text/javascript">
function subMenu(show) {
if (show){
document.getElementById('sub_menu').style.display = 'block';
} else {
document.getElementById('sub_menu').style.display = 'none';
}
}
</script>

<div class="top_menu">
<a href="index.html">Home</a>&nbsp;&nbsp; |&nbsp;&nbsp; 
<a href="link.html" onmouseover="javascript:subMenu(true);" onmouseout="javascript:subMenu(false);">SubmenuLink</a>&nbsp;&nbsp; |&nbsp;&nbsp; 
<a href="link.html">other Link 1</a>&nbsp;&nbsp; |&nbsp;&nbsp; 
<a href="link.html">other link 2</a>&nbsp;&nbsp; |&nbsp;&nbsp; 
</div>
<div style="display:none" id="sub_menu" onmouseover="javascript:subMenu(true);" onmouseout="javascript:subMenu(false);">
<a href="link.html">sub 1</a>&nbsp;&nbsp; |&nbsp;&nbsp; 
<a href="link.html">sub2</a>&nbsp;&nbsp; |&nbsp;&nbsp; 
</div>

Easy Show and Hide submenus

JavaScript