纵向的折叠菜单代码，点击展开，再点击收缩

发布时间：2018-09-26 23:21:13 所属栏目：政策来源：站长网

导读：纵向的折叠菜单代码，点击展开，再点击收缩。点一级主菜单会展开所属的二级菜单，再次点击就合拢了，最多支持两级，问答式菜单的风格，没有过多美化，美工不太好，想用的朋友就自己动手吧。不错，收藏一下。示例： !DOCTYPE HTML PUBLIC -//W3C//DTD HTML

　　纵向的折叠菜单代码，点击展开，再点击收缩。点一级主菜单会展开所属的二级菜单，再次点击就合拢了，最多支持两级，问答式菜单的风格，没有过多美化，美工不太好，想用的朋友就自己动手吧。不错，收藏一下。

　　示例：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>伸缩形的菜单</TITLE> </HEAD> <BODY> <table width="100%"> <tr id="main"><td bgcolor="#F6FFEC"><strong><a style="cursor:hand;"title="etststst">网站源码</a></strong></td> </tr> <tr id="sub" style="display:none;"><td><table width="300" border="0" cellspacing="0" cellpadding="0"> <tr> <td><ul> <li><a href="#">ASP</a></li> </ul></td> </tr> <tr> <td><ul> <li><a href="#">PHP</a></li> </ul></td> </tr> <tr> <td><ul> <li><a href="#">ASP.NET</a></li> </ul></td> </tr> </table></td> </tr> <tr id="main"><td><a href="#">编程源码</a></td> </tr> <tr id="sub" style="display:none;"><td><table width="300" border="0" cellspacing="0" cellpadding="0"> <tr> <td>vb</td> </tr> <tr> <td>VC</td> </tr> <tr> <td>DELPHI</td> </tr> <tr> <td>PB</td> </tr> </table> </td> </tr> <tr id="main"><td><a href="#">前端脚本</a></td> </tr> <tr id="sub" style="display:none;"><td> <table width="300" border="0" cellspacing="0" cellpadding="0"> <tr> <td><b>jQuery</b></td> </tr> <tr> <td>prototype</td> </tr> <tr> <td>ext</td> </tr> </table> <tr id="main"><td><a href="#">网页素材</a></td> </tr> <tr id="sub" style="display:none;"><td> <table width="300" border="0" cellspacing="0" cellpadding="0"> <tr> <td>Tab</td> </tr> <tr> <td>Menu</td> </tr> </table> </td> </tr> </table> <script for="main" event="onclick"> for(var i=0; i<sub.length; i++){ if (main[i] == this) sub[i].style.display = sub[i].style.display == '' ? 'none' : ''; else sub[i].style.display = 'none'; } </script> </BODY> </HTML><br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

（编辑：PHP编程网 - 黄冈站长网）

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