去参考一下别人写的吧,再改改,很快搞掂的.http://www.1studio.net/html/example/0055/0055.htm

解决方案 »

  1.   

    看看这个例子
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <style>
    .menu {  font-family: "Arial", "Helvetica", "sans-serif"; font-size: 10px; color: #FFFFFF; background-color: #006699; border-color: #CCCCCC #666666 #666666 #CCCCCC; border-style: outset; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; cursor: hand}
    .menuonmouse { font-family: "Arial", "Helvetica", "sans-serif"; font-size: 10px; color: #FFFFFF; background-color: #999999; border-color: #CCCCCC #666666 #666666 #CCCCCC; cursor: hand ; border-style: inset; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
    .menuonmouseout { font-family: "Arial", "Helvetica", "sans-serif"; font-size: 10px; color: #FFFFFF; background-color: #999999; border-color: #CCCCCC #666666 #666666 #CCCCCC; cursor: hand ; border-style: inset; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
    .menuonmouseover { font-family: "Arial", "Helvetica", "sans-serif"; font-size: 10px; color: #FFFFFF; background-color: #006699; border-color: #CCCCCC #666666 #666666 #CCCCCC; cursor: hand ; border-style: outset; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
    </style>
    </head><body bgcolor="#CCCCCC" text="#000000">
    <div id="Layer1" style="position:absolute; left:10px; top:10px; width:41px; height:24px; z-index:1"> 
      <table cellspacing="4">
        <tr> 
          <td nowrap id="menu1" class="menuonmouseout" onMouseOver="myover(this,menu01)" >菜单项一</td>
          <td nowrap id="menu2" class="menuonmouseout" onMouseOver="myover(this,menu02)" >菜单项二</td>
          <td nowrap id="menu3" class="menuonmouseout" onMouseOver="myover(this,menu03)" >菜单项三</td>
          <td nowrap id="menu4" class="menuonmouseout" onMouseOver="myover(this,menu04)" >菜单项四</td>
          <td nowrap id="menu5" class="menuonmouseout" onMouseOver="myover(this,menu05)" >菜单项五</td>
        </tr>
        <tr> 
          <td align="center" valign="top"> 
            <div id="menu01" style=" visibility: hidden"> 
              <table width="75%" border="0" class="menu" onMouseOver="myover(this,menu01)" onMouseOut="myout(this,menu01)">
                <tr> 
                  <td nowrap class="menuonmouseout" onMouseOver="myover(this,menu01)" onMouseOut="myout(this,menu01)" onclick="location='http://51js.1000box.net'">菜单项一.一</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu01)" onMouseOut="myout(this,menu01)">菜单项一.二</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu01)" onMouseOut="myout(this,menu01)">菜单项一.三</td>
                </tr>
              </table>
            </div>
          </td>
          <td align="center" valign="top"> 
            <div id="menu02" style=" visibility: hidden"> 
              <table width="75%" border="0" class="menu" onMouseOver="myover(this,menu02)" onMouseOut="myout(this,menu02)">
                <tr> 
                  <td nowrap class="menuonmouseout" onMouseOver="myover(this,menu02)" onMouseOut="myout(this,menu02)">菜单项二.一</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu02)" onMouseOut="myout(this,menu02)">菜单项二.二</td>
                </tr>
              </table>
            </div>
          </td>
          <td align="center" valign="top"> 
            <div id="menu03" style=" visibility: hidden"> 
              <table width="75%" border="0" class="menu" onMouseOver="myover(this,menu03)" onMouseOut="myout(this,menu03)">
                <tr> 
                  <td nowrap class="menuonmouseout" onMouseOver="myover(this,menu03)" onMouseOut="myout(this,menu03)">菜单项三.一</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu03)" onMouseOut="myout(this,menu03)">菜单项三.二</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu03)" onMouseOut="myout(this,menu03)">菜单项三.三</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu03)" onMouseOut="myout(this,menu03)">菜单项三.四</td>
                </tr>
              </table>
            </div>
          </td>
          <td valign="top" align="center"> 
            <div id="menu04" style=" visibility: hidden"> 
              <table width="75%" border="0" class="menu" onMouseOver="myover(this,menu04)" onMouseOut="myout(this,menu04)">
                <tr> 
                  <td nowrap class="menuonmouseout" onMouseOver="myover(this,menu04)" onMouseOut="myout(this,menu04)">菜单项四.一</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu04)" onMouseOut="myout(this,menu04)">菜单项四.二</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu04)" onMouseOut="myout(this,menu04)">菜单项四.三</td>
                </tr>
              </table>
            </div>
          </td>
          <td align="center" valign="top"> 
            <div id="menu05" style=" visibility: hidden"> 
              <table width="75%" border="0" class="menu" onMouseOver="myover(this,menu05)" onMouseOut="myout(this,menu05)">
                <tr> 
                  <td nowrap class="menuonmouseout" onMouseOver="myover(this,menu05)" onMouseOut="myout(this,menu05)">菜单项五.一</td>
                </tr>
                <tr> 
                  <td class="menuonmouseout" onMouseOver="myover(this,menu05)" onMouseOut="myout(this,menu05)">菜单项五.二</td>
                </tr>
              </table>
            </div>
          </td>
        </tr>
      </table>
    </div>
    <p> </p>
    </body>
    </html>
    <script>
    function myover(obj,menu)
    {
    menu1.className = "menuonmouseout";
    menu2.className = "menuonmouseout";
    menu3.className = "menuonmouseout";
    menu4.className = "menuonmouseout";
    menu5.className = "menuonmouseout"; obj.className = "menuonmouseover"; menu01.style.visibility = "hidden";
    menu02.style.visibility = "hidden";
    menu03.style.visibility = "hidden";
    menu04.style.visibility = "hidden";
    menu05.style.visibility = "hidden"; menu.style.visibility = "visible";
    }
    function myout(obj,menu)
    {
    obj.className = "menuonmouseout";
    menu.style.visibility = "hidden";
    }
    </script>
      

  2.   

    改起来很复杂,有人有pcoline.com.cn的今日报价点击后的那种框架码?谢谢,
      

  3.   

    这个可以吗?
    <style>
    .flyoutMenu {
    background-color: #F1F1F1;
    border-color: #999999;
    border-width: 0 1px 1px 0;
    border-style: solid;
    }
    .flyoutMenu TD.flyoutLink  {
    border-color: #F1F1F1;
    border-width: 1px;
    border-style: solid;
    font-family: Verdana,Arial;
    font-size: 70%;
    padding: 1px 25px 3px 6px;
    cursor: hand;
    }
    .flyoutLink a {
    color: black;
    text-decoration: none;
    }
    .flyoutLink a:hover {
    color: black;
    text-decoration: none;
    }
    .flyoutLink a:visited {
    color: black;
    text-decoration: none;
    }
    .flyoutLink a:active {
    color: black;
    text-decoration: none;
    }

    </style>
    <script>
    function over(){
    if(obj=event.srcElement)
    if(obj.className=="flyoutLink"){
    obj.style.backgroundColor='#cccccc'
    obj.style.borderColor = '#999999'
    }
    }
    function out(){
    if(obj=event.srcElement)
    if(obj.className=="flyoutLink"){
    obj.style.backgroundColor='#f1f1f1'
    obj.style.borderColor = '#f1f1f1'
    }
    }
    function show(d){
    if(obj=document.all(d)) obj.style.display=""
    }
    function hide(d){
    if(obj=document.all(d)) obj.style.display="none"
    }document.onmouseover=over
    document.onmouseout=out
    </script>
    <table cellpadding="0" cellspacing="0" border="0" width="100%">
    <tr><td>
    <table class="flyoutMenu" width="180" cellpadding="2" cellspacing="0" border="0" >
    <tr><td>
    <table width="175" cellpadding="0" cellspacing="0" border="0">
    <tr><td class="flyoutLink">微软菜单</td></tr>
    <tr><td class="flyoutLink" onmouseover=show("div1")  onmouseout=hide("div1")><a href="javascript:alert(1)">美国</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(2)">加拿大</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(3)">英国</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(4)">法国</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(5)">意大利</a></td></tr>
    </Table>
    </table>
    <table class="flyoutMenu" width="180" cellpadding="2" cellspacing="0" border="0" >
    <tr><td>
    <table width="175" cellpadding="0" cellspacing="0" border="0">
    <tr><td class="flyoutLink" ><a href="javascript:alert(5)">澳大利亚</a></td></tr>
    </table>
    </td></tr>
    </table>
    <table class="flyoutMenu" width="180" cellpadding="2" cellspacing="0" border="0" >
    <tr><td>
    <table width="175" cellpadding="0" cellspacing="0" border="0">
    <tr><td class="flyoutLink" handle="1672" onmouseover=show("div7")  onmouseout=hide("div7")><a href="javascript:alert(6)">中国</a></td></tr>
    <tr><td class="flyoutLink" ><a href="javascript:alert(7)">日本</a></td></tr>
    </table>
    </td></tr>
    </table>
    </td></tr>
    </table>
    <div id=div1 style="position:absolute;display:none;left:191;top:37" onmouseover=show("div1") onmouseout=hide("div1")>
    <table class="flyoutMenu" width="180" cellpadding="2" cellspacing="0" border="0" >
    <tr><td>
    <table width="175" cellpadding="0" cellspacing="0" border="0">
    <tr><td class="flyoutLink">美国菜单</td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(1)">纽约</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(2)">芝加哥</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(3)">三藩市</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(4)">华盛顿</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(5)">费城</a></td></tr>
    </Table>
    </table>
    </div>
    <div id=div7 style="position:absolute;display:none;left:191;top:165" onmouseover=show("div7") onmouseout=hide("div7")>
    <table class="flyoutMenu" width="180" cellpadding="2" cellspacing="0" border="0" >
    <tr><td>
    <table width="175" cellpadding="0" cellspacing="0" border="0">
    <tr><td class="flyoutLink">中国菜单</td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(1)">北京</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(2)">上海</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(3)">深圳</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(4)">厦门</a></td></tr>
    <tr><td class="flyoutLink"><a href="javascript:alert(5)">大连</a></td></tr>
    </Table>
    </table>
    </div>
      

  4.   

    qisanyou的菜单很不错
    olvest4000(sg):你另存后看看menugz.js和et.js2个文件,前者是定义菜单数组,后者是对数组的操作