一、说一下可伸缩的二级菜单,非常美观,根据需要可适当修改做为侧边栏使用,效果如下图:

可伸缩二级菜单

<div id="my_menu" class="sdmenu">
  <div>
 <span>一级菜单</span>
 <a href="#">二级菜单</a>
 <a href="#">二级菜单</a>
 <a href="#">二级菜单</a>
 <a href="#">二级菜单</a>
 <a href="#">二级菜单</a>
  </div>
  <div>
 <span>一级菜单</span>
 <a href="#">二级菜单</a>
 <a href="#">二级菜单</a>
 <a href="#">二级菜单</a>
  </div>
</div>

二、javascript代码有两段,一段放于</body>上面
<script type="text/javascript">
 // <![CDATA[
 var myMenu;
 window.onload = function() {
  myMenu = new SDMenu("my_menu");
  myMenu.init();
  var firstSubmenu = myMenu.submenus[0];
myMenu.expandMenu(firstSubmenu);
 };
 // ]]>
 </script>

三、另一段在<head></head>部分调用

调用代码:<script src="inc/sdmenu.js" type="text/javascript"></script>

点击上面图片右键另存为扩展名改为.rar即可获得sdmenu.js。


原创文章如转载,请注明:转载自蛐蛐工作室
原文地址:http://www.qqgzs.com/archives/393.html