一个简单的收缩菜单效果

ttx9n · 发表于 2007-3-5 00:00:00

<table width="174"> 
  <tr> 
    <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay0)" >网页设计</a></td> 
  </tr> 
  <tr id='lay0' style="display:none;"> 
    <td><table width="100%" border="0" cellspacing="0"> 
      <tr> 
        <td width="12%"> </td> 
        <td width="88%"><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网面设计&owen2=基础知识" target="_blank">基础知识</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网面设计&owen2=HTML和CSS" target="_blank">HTML和CSS</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网面设计&owen2=Dreamweaver" target="_blank">Dreamweaver</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网面设计&owen2=FrontPage" target="_blank">FrontPage</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网面设计&owen2=Xhtml" target="_blank">Xhtml</a></td> 
      </tr> 
    </table></td> 
  </tr> 
  <tr> 
    <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay1)" >FLASH</a></td> 
  </tr> 
  <tr id='lay1' style="display:none;"> 
    <td><table width="100%" border="0" cellspacing="0"> 
      <tr> 
        <td width="11%"> </td> 
        <td width="89%"><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=Flash&owen2=基础知识" target="_blank">基础知识</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=Flash&owen2=初级操作">初级操作</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=Flash&owen2=实例教学" target="_blank">实例教学</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=Flash&owen2=Action应用" target="_blank">Action应用</a></td> 
      </tr> 
    </table></td> 
  </tr> 
  <tr> 
    <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay2)" >平面设计</a></td> 
  </tr> 
  <tr id='lay2' style="display:none;"> 
    <td><table width="100%" border="0" cellspacing="0"> 
      <tr> 
        <td width="13%"> </td> 
        <td width="87%"><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=平面设计&owen2=基础知识" target="_blank">基础知识</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=平面设计&owen2=Photoshop">Photoshop</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=平面设计&owen2=Fireworks">Fireworks</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=平面设计&owen2=滤镜专辑" target="_blank">滤镜专辑</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=平面设计&owen2=CorelDraw" target="_blank">CorelDraw</a></td> 
      </tr> 
    </table></td> 
  </tr> 
  <tr> 
    <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay3)" >编程开发</a></td> 
  </tr> 
  <tr id='lay3' style="display:none;"> 
    <td><table width="100%" border="0" cellspacing="0"> 
      <tr> 
        <td width="13%"> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=编程开发&owen2=Asp" target="_blank">Asp</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=编程开发&owen2=ASP.NET" target="_blank">ASP.NET</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=编程开发&owen2=基础知识" target="_blank">JSP</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=编程开发&owen2=基础知识" target="_blank">PHP</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=编程开发&owen2=基础知识" target="_blank">数据库</a></td> 
      </tr> 
    </table></td> 
  </tr> 
  <tr> 
    <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay4)" >网页特效</a></td> 
  </tr> 
  <tr id='lay4' style="display:none;"> 
    <td><table width="100%" border="0" cellspacing="0"> 
      <tr> 
        <td width="13%"> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网页特效&owen2=窗体特效" target="_blank">窗体特效</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网页特效&owen2=菜单特效" target="_blank">菜单特效</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网页特效&owen2=文本特效" target="_blank">文本特效</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网页特效&owen2=鼠标特效" target="_blank">鼠标特效</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网页特效&owen2=图像媒体" target="_blank">图像媒体</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网页特效&owen2=时间日期" target="_blank">时间日期</a></td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td><a href="https://www.jb51.net/article/Teach_Dr.asp?owen1=网页特效&owen2=其它综合" target="_blank">其它综合</a></td> 
      </tr> 
    </table></td> 
  </tr> 
</table> 
<script language=JavaScript> 
function showmenu(strID){ 
    var i; 
    for(i=0;i<=4;i++){ 
        var lay; 
        lay = eval('lay' + i); 
        if (lay.style.display=="block" && lay!=eval(strID)){ 
            lay.style.display = "none"; 
        } 
    } 
    if (strID.style.display=="none"){ 
        strID.style.display = "block"; 
    }else{ 
        strID.style.display = "none"; 
    } 
} 
</script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

4k0mp7m · 发表于 2022-11-13 03:33:12

为全额万千瓦

v3sfsi · 发表于 2022-12-4 11:15:53

谢谢分享，先下来用用

小伙伴 · 发表于 2023-2-8 21:42:35

大家都不容易！

sykzus · 发表于 2023-3-24 04:40:33

看看看看

平平安安 · 发表于 2023-9-2 03:42:46

很不错的玩意

.l4 · 发表于 2023-10-25 14:30:36

vcxvcxv

q215357618 · 发表于 2023-11-4 03:00:21

那三门，你们谁寂寞才快乐撒

e8hwl6prw · 发表于 2023-11-11 22:14:50

的谁vdvdsvdsvdsdsv

errol123 · 发表于 2023-11-28 07:58:51

谢谢楼主分享

账号		自动登录	找回密码
密码			立即注册

[JavaScript] 一个简单的收缩菜单效果

相关帖子