zoukankan      html  css  js  c++  java
  • Flash效果的网站后台左侧Js多级展开菜单代码

    代码简介:

    这款形式的菜单对于站长来说再熟悉不过了,说不定我们每天都会见到它,而且也在使用它,我们都知道后台左侧的Js菜单,一般都是可多级展开的,就像这款菜单一样,简洁美观,如果你是一位网站程序开发者的话,完全可以可以用这款菜单作为你的后台管理控制菜单。

    代码内容:

    <html>
    <head>
    <titile>Flash效果的网站后台左侧Js多级展开菜单代码_网页代码站(www.webdm.cn)</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <style type=text/css>
    body  { background:#799AE1; margin:0px; font:normal 12px 宋体; }
    table  { border:0px; }
    td  { font:normal 12px; }
    img  { vertical-align:bottom; border:0px; }
    a  { font:normal 12px 宋体; color:#215DC6; text-decoration:none; }
    a:hover  { color:#428EFF }
    .sec_menu  { border-left:1px solid white; border-right:1px solid white; border-bottom:1px solid white; 
    
    overflow:hidden; background:#D6DFF7; }
    .menu_title  { }
    .menu_title span  { position:relative; top:2px; left:8px; color:#215DC6; font-weight:bold; }
    .menu_title2  { }
    .menu_title2 span  { position:relative; top:2px; left:8px; color:#428EFF; font-weight:bold; }
    </style>
    <script language=javascript>
    function menuShow(obj,maxh,obj2)
    {
      if(obj.style.pixelHeight<maxh)
      {
        obj.style.pixelHeight+=maxh/20;
        obj.filters.alpha.opacity+=5;
        obj2.background="";
        if(obj.style.pixelHeight==maxh/10)
          obj.style.display='block';
        myObj=obj;
        myMaxh=maxh;
        myObj2=obj2;
        setTimeout('menuShow(myObj,myMaxh,myObj2)','5');
      }
    }
    function menuHide(obj,maxh,obj2)
    {
      if(obj.style.pixelHeight>0)
      {
        if(obj.style.pixelHeight==maxh/20)
          obj.style.display='none';
        obj.style.pixelHeight-=maxh/20;
        obj.filters.alpha.opacity-=5;
        obj2.background="";
        myObj=obj;
        myMaxh=maxh
        myObj2=obj2;
        setTimeout('menuHide(myObj,myMaxh,myObj2)','5');
      }
      else
        if(whichContinue)
          whichContinue.click();
    }
    function menuChange(obj,maxh,obj2)
    {
      if(obj.style.pixelHeight)
      {
        menuHide(obj,maxh,obj2);
        whichOpen='';
        whichcontinue='';
      }
      else
        if(whichOpen)
        {
          whichContinue=obj2;
          whichOpen.click();
        }
        else
        {
          menuShow(obj,maxh,obj2);
          whichOpen=obj2;
          whichContinue='';
        }
    }
    </script>
    <base target=main>
    </head>
    <body onselectstart="return false;" ondragstart="return false;" oncontextmenu="return false;">
     
    <table cellpadding=0 cellspacing=0 width=142 align=center>
      <tr style="cursor:hand;">
        <td height=25 class=menu_title onmouseover=this.className='menu_title2'; 
    
    onmouseout=this.className='menu_title';  id=menuTitle1 onclick="menuChange(menu1,80,menuTitle1);">
          <span>系统选项</span>
        </td>
      </tr>
      <tr>
        <td>
          <div class=sec_menu style="158px;height:80px;filter:alpha(Opacity=100);overflow:hidden;" id=menu1>
            <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
              <tr>
                <td height=20>
                  <a href=/ onfocus=this.blur();><img src=http://www.webdm.cn/images/20090920/dots.gif>
                  安全选项</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://codefans.net onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  垃圾邮件选项</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  动态规则选项</a>
                </td>
              </tr>
            </table>
          </div>
        </td>
      </tr>
    </table>
    <script language=javascript>
      var whichOpen=menuTitle1;
      var whichContinue='';
    </script>
     
    <table cellpadding=0 cellspacing=0 width=158 align=center>
      <tr style="cursor:hand;">
        <td height=25 class=menu_title onmouseover=this.className='menu_title2'; 
    
    onmouseout=this.className='menu_title';  id=menuTitle2 onclick="menuChange(menu2,120,menuTitle2);">
          <span>系统规则</span>
        </td>
      </tr>
      <tr>
        <td>
          <div class=sec_menu style="158;height:0;filter:alpha(Opacity=0);display:none;" id=menu2>
            <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  IP过滤规则</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  信封过滤规则</a>
                </td>
              </tr>
             </table>
          </div>
        </td>
      </tr>
    </table>
     
    <table cellpadding=0 cellspacing=0 width=158 align=center>
      <tr style="cursor:hand;">
        <td height=25 class=menu_title onmouseover=this.className='menu_title2'; 
    
    onmouseout=this.className='menu_title';  id=menuTitle3 onclick="menuChange(menu3,120,menuTitle3);">
          <span>系统管理</span>
        </td>
      </tr>
      <tr>
        <td>
          <div class=sec_menu style="158;height:0;filter:alpha(Opacity=0);display:none;" id=menu3>
            <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  用户管理</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  进程管理</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  主机状态</a>
                </td>
              </tr>
            </table>
          </div>
        </td>
      </tr>
    </table>
     
    <table cellpadding=0 cellspacing=0 width=158 align=center>
      <tr style="cursor:hand;">
        <td height=25 class=menu_title onmouseover=this.className='menu_title2'; 
    
    onmouseout=this.className='menu_title'; id=menuTitle4 onclick="menuChange(menu4,140,menuTitle4);">
          <span>系统统计</span>
        </td>
      </tr>
      <tr>
        <td>
          <div class=sec_menu style="158;height:0;filter:alpha(Opacity=0);display:none;" id=menu4>
            <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
             <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  信头过滤统计</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  信体过滤统计</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  附件过滤统计</a>
                </td>
              </tr>
              <tr>
                <td height=20>
                  <a href=http://webdm.cn onfocus=this.blur();><img 
    
    src=http://www.webdm.cn/images/20090920/dots.gif>
                  动态规则统计</a>
                </td>
              </tr>
            </table>
          </div>
        </td>
      </tr>
    </table>
    <table cellpadding=0 cellspacing=0 width=158 align=center>
      <tr style="cursor:hand;">
        <td height=25 class=menu_title onmouseover=this.className='menu_title2'; 
    
    onmouseout=this.className='menu_title';>
          <span>退出系统</span>
        </td>
      </tr>
    </table>
    </body>
    </html>
    <br>
    <p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>
    

    代码来自:http://www.webdm.cn/webcode/c43b98aa-baa0-4213-ada3-e979b4fdf84a.html

  • 相关阅读:
    【STM32F429开发板用户手册】第46章 STM32F429的DMA2D应用之刷色块,位图和Alpha混合
    【STM32F429开发板用户手册】第45章 STM32F429的图形加速器DMA2D的基础知识和HAL库API
    【STM32F429开发板用户手册】第44章 STM32F429的LTDC应用之LCD电阻触摸和电容触摸
    【STM32F429开发板用户手册】第43章 STM32F429的LTDC应用之汉字小字库和全字库制作
    【STM32F429开发板用户手册】第42章 STM32F429的LTDC应用之点阵字体和字符编码(重要)
    【STM32F429开发板用户手册】第41章 STM32F429的LTDC应用之LCD汉字显示和2D图形显示
    【STM32F429开发板用户手册】第40章 STM32F429的LCD控制器LTDC基础知识和HAL库API
    【STM32F429开发板用户手册】第39章 STM32F429的FMC总线应用之SDRAM
    【STM32F429开发板用户手册】第38章 STM32F429的FMC总线应用之是32路高速IO扩展
    MDK,IAR,GCC生成库文件的方法(2020-08-04)
  • 原文地址:https://www.cnblogs.com/webdm/p/1992236.html
Copyright © 2011-2022 走看看