我的经典下拉菜单,增加了使div层能显示在select表单控件之上的功能

<style>
body{margin:0;padding:0px;text-align:center;SCROLLBAR-FACE-COLOR: #47363C; SCROLLBAR-HIGHLIGHT-COLOR: #47363C; SCROLLBAR-SHADOW-COLOR: #B69EA7;}
body,div,table,td,p,span,input,textarea,select{font-family:Arial, Helvetica, sans-serif; font-size:12px;}
html {scrollbar-face-color:#B69EA7; scrollbar-3dlight-color:#B69EA7;      scrollbar-highlight-color:#fff;      scrollbar-Shadow-color:#E2D8DD; scrollbar-track-color:#E2D8DD;      scrollbar-arrow-color:#46353B; scrollbar-darkshadow-color:#46353B;}
ul{margin:0; padding:0px;}
      #web_top_navigation{ clear:both;background:url(mode_12.jpg) top left repeat-x;height:24px; color:#FFF;text-align:center; width:100%; background-color:#000;}
            #web_top_navigation ul{ clear:both; list-style:none;}
            #web_top_navigation ul li{ float:left; font-weight:bold;line-height:24px; font-size:14px; WHITE-SPACE: nowrap;list-style: none; display: inline;}
            #web_top_navigation A:link { COLOR: #fff; TEXT-DECORATION: none;}
            #web_top_navigation A:visited { COLOR: #fff; TEXT-DECORATION: none;}
            #web_top_navigation A:hover { COLOR: #f60; TEXT-DECORATION: none;}
            #web_top_navigation A:active { COLOR: #fff; TEXT-DECORATION: none;}
            .menu_css { BORDER:1px 1px 1px 1px #fff solid; Z-INDEX: 3000; POSITION: absolute; BACKGROUND-COLOR: #3C2D34; text-align:left; width:160px; padding:4px;}
                  .menu_css A { DISPLAY: block; WIDTH: 100%; PADDING: 3px 4px 3px 4px; }
                  .menu_css A:link { TEXT-DECORATION: none;}
                  .menu_css A:visited { TEXT-DECORATION: none;}
                  .menu_css A:hover { TEXT-DECORATION: none;}
                  .menu_css A:active { TEXT-DECORATION: none;}
                  .menu_css A:hover { COLOR: #f60; BACKGROUND-COLOR: #fff; font-weight:bold;}
</style>
<script>
<!--
      var disappeardelay=250
      var enableanchorlink=0
      var hidemenu_onclick=1
      var ie5=document.all
      var ns6=document.getElementById&&!document.all
      function getposOffset(what, offsettype){
      var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
      var parentEl=what.offsetParent;
      while (parentEl!=null){
      totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
      parentEl=parentEl.offsetParent;
      }
      return totaloffset;
      }
      function showhide(obj, e){
            if (ie5||ns6)
            dropmenuobj.style.left=dropmenuobj.style.top=-500;
            if (e.type=="click" && obj.display=="none" || e.type=="mouseover"){
                  obj.display="";
                  //下面这两行是动态设置iframe的宽与高与当前显示的Div宽高一致,请注意iframe的ID,在此为'frm_'+DiV的ID所组成, iframe在此的作用是使div层能显示在下拉菜单表单控件之上,如果不需要Iframe可删除
                  document.getElementById('frm_'+dropmenuobj.id).style.height=document.getElementById(dropmenuobj.id).clientHeight;
                  document.getElementById('frm_'+dropmenuobj.id).style.width=document.getElementById(dropmenuobj.id).clientWidth;
            }else if (e.type=="click"){
                  obj.display="none";
            }
      }
      function iecompattest(){
      return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
      }
      function clearbrowseredge(obj, whichedge){
      var edgeoffset=0
      if (whichedge=="rightedge"){
      var windowedge=ie5 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
      dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
      if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
      edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
      }
      else{
      var windowedge=ie5 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
      dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
      if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure)
      edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
      }
      return edgeoffset
      }
      function dropdownmenu(obj, e, dropmenuID){
      if (window.event) event.cancelBubble=true
      else if (e.stopPropagation) e.stopPropagation()
      if (typeof dropmenuobj!="undefined")
      dropmenuobj.style.display="none"
      clearhidemenu()
      if (ie5||ns6){
      obj.onmouseout=delayhidemenu
      dropmenuobj=document.getElementById(dropmenuID)
      if (hidemenu_onclick) dropmenuobj.onclick=function(){dropmenuobj.style.display="none"}
      dropmenuobj.onmouseover=clearhidemenu
      dropmenuobj.onmouseout=ie5? function(){ dynamichide(event)} : function(event){ dynamichide(event)}
      showhide(dropmenuobj.style, e)
      dropmenuobj.x=getposOffset(obj, "left")
      dropmenuobj.y=getposOffset(obj, "top")
      dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
      dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
      }
      return clickreturnvalue()
      }
      function clickreturnvalue(){
      if ((ie5||ns6) && !enableanchorlink) return false
      else return true
      }
      function contains_ns6(a, b) {
      while (b.parentNode)
      if ((b = b.parentNode) == a)
      return true;
      return false;
      }
      function dynamichide(e){
      if (ie5&&!dropmenuobj.contains(e.toElement))
      delayhidemenu()
      else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
      delayhidemenu()
      }
      function delayhidemenu(){
      delayhide=setTimeout("dropmenuobj.style.display='none'",disappeardelay)
      }
      function clearhidemenu(){
      if (typeof delayhide!="undefined")
      clearTimeout(delayhide)
      }
-->
</script>
<div id="web_top_navigation">
      <ul>
            <li style="width:180px;"><a onMouseOver="dropdownmenu(this, event, 'menu1')" href="#">MENU 1</a></li>
            <li style="width:200px;"><a onMouseOver="dropdownmenu(this, event, 'menu2')" href="#">MENU 2</a></li>
            <li style="width:124px;"><a onMouseOver="dropdownmenu(this, event, 'menu3')" href="#">MENU 3</a></li>
      </ul>
      <div class='menu_css' id='menu1' style='display:none;'>
            <a href='#'>CHILDREN MENU 1</a>
            <a href='#'>CHILDREN MENU 2</a>
            <a href='#'>CHILDREN MENU 3</a>
            <a href='#'>CHILDREN MENU 4</a>
            <a href='#'>CHILDREN MENU 5</a>
            <a href='#'>CHILDREN MENU 6</a>
            <a href='#'>CHILDREN MENU 7</a>
            <!--下面的iframe在此的作用是使div层能显示在下拉菜单表单控件之上,如果不需要可删除-->
            <iframe src='/javascript:false' id='frm_menu1' style='z-index:-1; filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0); left:0px; visibility:inherit; position:absolute; top:0px; width:100%; height:100%;'> </iframe>
      </div>
      <div class='menu_css' id='menu2' style='display:none;'>
            <a href='#'>CHILDREN MENU 1</a>
            <a href='#'>CHILDREN MENU 2</a>
            <a href='#'>CHILDREN MENU 3</a>
            <a href='#'>CHILDREN MENU 4</a>
            <a href='#'>CHILDREN MENU 5</a>
            <a href='#'>CHILDREN MENU 6</a>
            <a href='#'>CHILDREN MENU 7</a>
            <iframe src='/javascript:false' id='frm_menu2' style='z-index:-1; filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0); left:0px; visibility:inherit; position:absolute; top:0px; width:100%; height:100%;'> </iframe>
      </div>
      <div class='menu_css' id='menu3' style='display:none;'>
            <a href='#'>CHILDREN MENU 1</a>
            <a href='#'>CHILDREN MENU 2</a>
            <a href='#'>CHILDREN MENU 3</a>
            <a href='#'>CHILDREN MENU 4</a>
            <a href='#'>CHILDREN MENU 5</a>
            <a href='#'>CHILDREN MENU 6</a>
            <a href='#'>CHILDREN MENU 7</a>
            <iframe src='/javascript:false' id='frm_menu3' style='z-index:-1; filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0); left:0px; visibility:inherit; position:absolute; top:0px; width:100%; height:100%;'> </iframe>
      </div>
</div>