Menu i layers med undermenu, samt problemstillingen select bokse.

Jeg har forsøgt at kreere en venstre stillet menu med dertil hørende undermenu i layers.
Disse undermenu(er) skal skjule diverse select bokse (det virker egentligt udemærket).
Men det der pt. ikke virker helt tilfredstillende er onmouseout ved undermenu i IE.
Er der nogen der sidder inde med en god løsning.
Og det skal være viderebygning på min egen kode (hvis den ellers dur!)
Hvis i ikke helt forstår hvad jeg mener, så kopier min kode og se den i exploreren og kør musen over min undermenu.
Desuden hvorfor virker min onmouseout i Ns kun når jeg skriver den i onload og ikke i selve div én.
Det var en lang smøre men jeg håber der er hjælp at hente.
Det haster meget!
<html>
<head>
<STYLE>
.menu { color: white; background-color: orange; }
#layer1 {
  position: absolute;
  z-index: 2;
  left: 50px;
  visibility: hidden;
}
#layer2 {
  position: absolute;
  z-index: 1;
  left: 0px;
}   
</STYLE>
<SCRIPT> 
   
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false
ns6 = (document.getElementById)? true:false;

// Show/Hide functions for non-pointer layer/objects
function show(id) {
    if (ns4) document.layers[id].visibility = \"show\"
    else if (ie4) document.all[id].style.visibility = \"visible\"   
    else if (ns6) document.getElementById(id).style.visibility = \"visible\"
}

function hide(id) {
    if (ns4) document.layers[id].visibility = \"hide\"
    else if (ie4) document.all[id].style.visibility = \"hidden\"       
    else if (ns6) document.getElementById(id).style.visibility = \"hidden\"
}
     
//fjern noget af select boksen
function clipSelect () {
    if (ns4) {                                                         
        document.layer2.oldClipWidth = document.layer2.document.width;
        document.layer2.clip.width = 50;
  }
      else if (ie4)                               
        document.all.layer2.style.clip = \'rect(auto 50px auto auto)\';
}
                             
//vis noget af select boksen igen
function unclipSelect () {
    if (ns4)
        document.layer2.clip.width = document.layer2.oldClipWidth;
      else if (ie4)                                 
        document.all.layer2.style.clip = \'rect(auto auto auto auto)\';
}   

//denne function viser select boksen igen og gemmer undermenuen
function hideUnClip () {
    if (ns4)   
        document.layer1.onmouseout = function () {
        hide(this.id);
        unclipSelect();
    }
}

//denne function viser select boksen igen og gemmer undermenu
function hideIEUnClip(){
    if (ie4){     
        document.all.layer1.onmouseout = function () {
            hide(this.id);
            unclipSelect();                         
        }
    }
}   
       
</script>
</head>
<body onload=\"hideUnClip();\">
<A HREF=\"#\" onmouseover=\"show(\'layer1\'); clipSelect();\">
Menu punkt
</A>
<br>
<div id=\"layer1\" onmouseout=\"hideIEUnClip();\">
<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr><td class=\"javascript\"><a href=\"#\">menu punkt</a></td></tr><tr><td class=\"php\"><a href=\"#\">menu punkt</a></td></tr><tr><td class=\"python\"><a href=\"#\">menu punkt</a></td></tr></table>
</div>
<div id=\"layer2\">
        <form name=\"formname\">
            <select name=\"aselect\" width=\"150\" style=\"width: 150px;\">
                <option>underpunkt1
                <option>underpunkt2
                <option>underpunkt3
            </select>
        </form>
    </div>
</body>
</html>