请问如何用javascript做横向下拉菜单?

优先级别高的菜单,跨框架，不会被select遮挡<TABLE WIDTH=300 BORDER=1 CELLPADDING=1 CELLSPACING=1 bordercolor='#FFFFFF' bgcolor='lightblue' style='cursor:hand'>
  <TR>
<TD onmouseover="showMenu(this,'大菜11,大菜12'); ">主菜1</TD>
<TD onmouseover="showMenu(this,'大菜21,大菜22' );">主菜2</TD>
<TD onmouseover="showMenu(this,'大菜31,大菜32'); ">主菜3</TD>
</TR>
</TABLE>
 
<SCRIPT>
var oPopup = window.createPopup();
function showMenu(obj,S)
{
    var oPopBody ,rows,Arr;
    var oPopBody = oPopup.document.body;
    oPopBody.style.backgroundColor = "lightblue";
    oPopBody.style.border = "solid #eeeeee 1px";
    Arr=S.split(",");
    oPopBody.innerHTML = HTML(Arr);
    rows=Arr.length;
    oPopup.show(obj.offsetLeft + 10, obj.offsetTop + 40, 105, rows * 31, document.body)  ;
}
function HTML(A)
{
    var str="<TABLE WIDTH=300 BORDER=1 CELLPADDING=1 CELLSPACING=1 bordercolor='#FFFFFF' bgcolor='lightblue' style='cursor:hand'>";
    for (StrA in A)
    {
str+="<TR><TD>" + A[StrA] + "</TD></TR>" ;
    }  
    str+= "</TABLE>" ;
    return(str);
}
</SCRIPT>