<div onmouseover="sub.style.display='block'" onmouseout="sub.style.display='none'">menu</div>
<div id=sub style="display:none">
<table><tr><td>sub1</td></tr>
<tr><td>sub2</td></tr>
<tr><td>sub3</td></tr>
</table>
</div>
(转)

解决方案 »

  1.   

    <HTML>
    <HEAD>
    <META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
    <TITLE></TITLE>
    </HEAD>
    <BODY>
    <style>  
    body,td,a  {font-size:9pt;color:black;text-decoration:none}  
    .normal  {padding:2px}  
    .up  {padding:1px;border:#999999  1px  solid;background:#cccccc}  
    .down  {padding:1px;border:dbdbdb  1px  solid;background:dbdbdb}  
    </style>  
    <body  onmousemove="move()">  
    <div  style="position:absolute;z-index:1;width:1;height:1;  left:  100;  top:  100"  ID=plane  onmousedown="down=true;divleft=event.clientX-parseInt(plane.style.left);divtop=event.clientY-parseInt(plane.style.top)"  onmouseup="down=false">    
    <table  id="td123"  cellspacing=2  width=100  border=0  style="BORDER:#999999  1px  solid;cursor:hand"  cellpadding="0"  bgcolor="f4f4f4">  
    <tr>  
    <td  bgcolor="#cccccc"  height="20"  style="BORDER:#999999  1px  solid;cursor:move">  
    <div  align="center">透明的菜单</div>  
    </td>  
    </tr>  
    <tr>  
    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this),menu1.style.visibility='visible'"  onMouseOut="this.className='normal',low(this),menu1.style.visibility='hidden'"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'"  >  
    <div  align="right">有下级菜单>></div>  
    </td>  
    </tr>  
    <tr>  
    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this),menu2.style.visibility='visible'"  onMouseOut="this.className='normal',low(this),menu2.style.visibility='hidden'"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'"  >  
    <div  align="right">有下级菜单>></div>  
    </td>  
    </tr>  
    <tr>  
    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">  
    <div  align="right">无下级菜单>></div>  
    </td>  
    </tr>  
    <tr>  
    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">  
    <div  align="right">无下级菜单>></div>  
    </td>  
    </tr>  
    </table>  
    <script  language="JavaScript">  
    <!--  
    function  flashit(){  
    if  (!document.all)  
    return  
    if  (td123.style.borderColor=="#666666")  
    td123.style.borderColor="#999999"  
    else  
    td123.style.borderColor="#666666"  
    }  
    setInterval("flashit()",  500)  
    //-->  
    </script>  
    <script  language="javascript">  
    <!--  
    function  high(image)  
    {  
    theobject=image  
    highlighting=setInterval  ("highlightit(theobject)",100)  
    }  
    function  low(image)  
    {  
    clearInterval(highlighting)  
    image.filters.alpha.opacity=50  
    }  
    function  highlightit(cur2)  
    {  
    if  (cur2.filters.alpha.opacity<100)  
    cur2.filters.alpha.opacity+=20  
    else  if  (window.highlighting)  
    clearInterval  (highlighting)  
    }  
    //-->  
    </script>  
    <script>  
    var  over=false,down=false,divleft,divtop;  
    function  move(){  
    if(down){  
    plane.style.left=event.clientX-divleft;  
    plane.style.top=event.clientY-divtop;  
    }  
    }  
    </script>  
        <div  id="menu2"  style="position:absolute;top:45px;left:96;  z-index:1;  visibility:  hidden;  width:  105"  
    onMouseOver=this.style.visibility='visible'  
    onMouseOut=this.style.visibility='hidden'>    
            <table  cellspacing=2  width=100  border=0  style="BORDER:#999999  1px  solid;cursor:hand"  cellpadding="0"  bgcolor="f4f4f4"  align="right">  
                <tr>    
                    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
                        <div  align="center">子菜单</div>  
                    </td>  
                </tr>  
                <tr>    
                    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
                        <div  align=center>子菜单</div>  
                    </td>  
                </tr>  
                <tr>    
                    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
                        <div  align=center>子菜单</div>  
                    </td>  
                </tr>  
                <tr>    
                    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
                        <div  align=center>子菜单</div>  
                    </td>  
                </tr>  
            </table>  
        </div>  
        <div  id="menu1"  style="position:absolute;top:24px;left:96px;  z-index:1;  visibility:  hidden;  width:  105"  
    onMouseOver=this.style.visibility='visible'  
    onMouseOut=this.style.visibility='hidden'>    
            <table  cellspacing=2  width=100  border=0  style="BORDER:#999999  1px  solid;cursor:hand"  cellpadding="0"  bgcolor="f4f4f4"  align="right">  
                <tr>    
                    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
                        <div  align="center">子菜单</div>  
                    </td>  
                </tr>  
                <tr>    
                    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
                        <div  align=center>子菜单</div>  
                    </td>  
                </tr>  
    <tr>    
    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
    <div  align=center>子菜单</div>  
    </td>  
    </tr>  
    <tr>    
    <td  class=normal  onMouseDown="this.className='down'"  
    onMouseOver="this.className='up',high(this)"  onMouseOut="this.className='normal',low(this)"  style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">    
    <div  align=center>子菜单</div>  
    </td>  
    </tr>  
    </table>  
    </div>  
    </div> 
    </BODY>
    </HTML>