zoukankan      html  css  js  c++  java
  • 漂亮的仿flash菜单,来自蓝色经典

    <style>
    /* 先把这个 xmenu 的样式放到css里 */
    .xmenu td{font-size:12px;font-family:verdana,arial;font-weight:bolder;color:#ffffff;border:1px solid #336699;background:#336699;filter:blendtrans(duration=0.5);cursor:hand;text-align:center;}
    </style>

    <script>
    /*
    http://lexrus.blueidea.com/

    这是把事件动作绑定到菜单上的函数
    */
    function attachXMenu(objid){
     var tds=objid.getElementsByTagName('td');
     for(var i=0;i<tds.length;i++){
      with(tds[i]){
       onmouseover=function(){
        with(this){
         filters[0].apply();
         style.background='#66CCFF'; //这是鼠标移上去时的背景颜色
         style.border='1px solid #ffffff'; //边框
         style.color='black'; //文字颜色
         filters[0].play();
        }
       }
       onmouseout=function(){
        with(this){
         filters[0].apply();
         style.background='#336699'; //这是鼠标离开时的背景颜色
         style.border='1px solid #336699'; //边框
         style.color='#ffffff'; //文字颜色
         filters[0].play();
        }
       }
      }
     }
    }
    </script>

    <!--菜单从这里开始, 注意要把class设置成和css里相同的, 还要为它设一个id-->
    <table class="xmenu" id="xmenu0" width="500" cellpadding="1" cellspacing="4" border="0" bgcolor="#336699" align="center">
     <tr>
      <td><a href="http://www.lenvo.cn/%22%3Ewww.lenvo.cn%3C/a%3E%3C/td>
      <td>Name</td>
      <td>Is</td>
      <td>LeX</td>
      <td>Rus</td>
      <td>!!!</td>
     </tr>
    </table>

    <script>attachXMenu(xmenu0); //在上面这个table结束的地方执行事件动作的绑定, 这里的这个xmenu0就是那个table的id</script>
    <br><br><br><br>
    <!--下面这个是竖排的-->
    <table class="xmenu" id="xmenu1" width="100" cellpadding="1" cellspacing="4" border="0" bgcolor="#336699" align="center">
     <tr><td>My</td></tr>
     <tr><td>Name</td></tr>
     <tr><td>Is</td></tr>
     <tr><td>LeX</td></tr>
     <tr><td>Rus</td></tr>
     <tr><td>!!!</td></tr>
    </table>
    <script>attachXMenu(xmenu1);</script>

  • 相关阅读:
    Binary Tree Inorder Traversal
    Populating Next Right Pointers in Each Node
    Minimum Depth of Binary Tree
    Majority Element
    Excel Sheet Column Number
    Reverse Bits
    Happy Number
    House Robber
    Remove Linked List Elements
    Contains Duplicate
  • 原文地址:https://www.cnblogs.com/itecho/p/1307123.html
Copyright © 2011-2022 走看看