<script>
<!--
var muCnt = 3;
var aryLt = new Array();
aryLt[0] = 10;
aryLt[1] = 210;
aryLt[2] = 410;
function fncShow( pos )
{
var i =0;
var dv = document.getElementById("sub");
dv.style.display = '';
for( i; i<muCnt; i++ )
{
var obj = document.getElementById("menu"+i);
if( i == pos )
{
obj.style.display = '';
}
else
{
obj.style.display = 'none';
}
}
dv.style.left = aryLt[pos];
}
function fncHide( pos )
{
var obj = document.getElementById("menu"+pos);
obj.style.display = 'none';
var dv = document.getElementById("sub");
dv.style.display = 'none';
}
//-->
</script>
<table cellpadding='0' cellspacing='1' border='1' width='600' height='60'>
<tr height='30'>
<td width='200' onmouseover='javascript:fncShow(0);'><a href="">Home</a></td>
<td width='200' onmouseover='javascript:fncShow(1);'>BBS</td>
<td width='200' onmouseover='javascript:fncShow(2);'>Download</td>
</tr>
</table>
<div id='sub' style='position:absolute; left:11px; top:73px; background-color:gray; width:200; padding:1px; display:none;'>
<div id='menu0' style='background-color:#FFFFFF; display:none;' cellpadding='0' cellspacing='0' border='0' width='300' height='30' bgcolor='#FFFFFF' onmouseout='javascript:fncHide(0);'>
<span style='width:100%; height:100%;'>
AAA-1<br>
AAA-2<br>
AAA-3
</span>
</div>
<div id='menu1' style='background-color:#FFFFFF; display:none;' cellpadding='0' cellspacing='0' border='0' width='200' height='30' bgcolor='#FFFFFF' onmouseout='javascript:fncHide(1);'>
<span style='width:100%; height:100%;'>
BBB-1<br>
BBB-2<br>
BBB-3
</span>
</div>
<div id='menu2' style='background-color:#FFFFFF; display:none;' cellpadding='0' cellspacing='0' border='0' width='200' height='30' bgcolor='#FFFFFF' onmouseout='javascript:fncHide(2);'>
<span style='width:100%; height:100%;'>
CCC-1<br>
CCC-2<br>
CCC-3
</span>
</div>
</div>