竖直的JS折叠菜单代码，点击睁开和紧缩

发布时间：2018-08-25 21:11:43 所属栏目：创业来源：站长网

导读：一款竖直的JS折叠菜单代码，点击睁开和紧缩，老是表现一个菜单项，又称为手风琴菜单，常常来猛火网作客的伴侣必然阅读过很多手风琴菜单，这是一个来自海外网站的原生菜单，简捷的灰色气魄威风凛凛。示例： !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transition

　　一款竖直的JS折叠菜单代码，点击睁开和紧缩，老是表现一个菜单项，又称为“手风琴”菜单，常常来猛火网作客的伴侣必然阅读过很多“手风琴菜单”，这是一个来自海外网站的原生菜单，简捷的灰色气魄威风凛凛。

　　示例：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>折叠睁开的菜单</title> </head> <body><style type="text/css"> .menutitle{ cursor:pointer; margin-bottom: 5px; background-color:#ECECFF; color:#000000; width:140px; padding:2px; text-align:center; font-weight:bold; /*/*/border:1px solid #000000;/* */ } .submenu{ margin-bottom: 0.5em; } </style> <script type="text/javascript"> if (document.getElementById){ //DynamicDrive.com change document.write('<style type="text/css">n') document.write('.submenu{display: none;}n') document.write('</style>n') } function SwitchMenu(obj){ if(document.getElementById){ var el = document.getElementById(obj); var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change if(el.style.display != "block"){ //DynamicDrive.com change for (var i=0; i<ar.length; i++){ if (ar[i].className=="submenu") //DynamicDrive.com change ar[i].style.display = "none"; } el.style.display = "block"; }else{ el.style.display = "none"; } } } </script>  <div id="masterdiv"> <div class="menutitle" onclick="SwitchMenu('sub1')">Site Menu</div> <span class="submenu" id="sub1"> - <a href="#">What's New</a><br> - <a href="#">What's hot</a><br> - <a href="#">Revised Scripts</a><br> - <a href="#">More Zone</a> </span> <div class="menutitle" onclick="SwitchMenu('sub2')">FAQ/Help</div> <span class="submenu" id="sub2"> - <a href="#">Usage Terms</a><br> - <a href="#">DHTML FAQs</a><br> - <a href="#">Scripts FAQs</a> </span> <div class="menutitle" onclick="SwitchMenu('sub3')">Help Forum</div> <span class="submenu" id="sub3"> - <a href="#">Coding Forums</a><br> </span> <div class="menutitle" onclick="SwitchMenu('sub4')">Cool Links</div> <span class="submenu" id="sub4"> - <a href="http://www.javascriptkit.com"><b>Java</b>Script Kit</a><br> - <a href="http://www.liehuo.net">Veryhuo.COM</a><br> - <a href="http://www.cooltext.com">Cool Text</a><br> </span> </div> </body> </html><div style="text-align:center;margin:30px 0 0 0;"><hr style="color:#999;height:1px;">如不能表现结果，请按Ctrl+F5革新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></div>
提醒：可修改儿女码再运行!

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

2021创业做什么好？低	香港虚拟主机，香港虚
《启航当风起时》起于	域名最网站至关重要如