我正在尝试制作一个使子项可折叠的引导程序侧面菜单.
与http://jsfiddle.net/相似
但是我想要子菜单中的链接项而不是这么复杂的结构.
这就是我试过的
<div class="row"> <!-- Main component for a primary marketing message or call to action --> <div class="col-sm-3 col-md-2 sidebar"> <ul class="nav nav-sidebar"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">More<b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">Blog</a></li> <li><a href="#">About US</a></li> <li><a href="#">Jobs</a></li> </ul> </li> <li><a href="">Nav item again</a></li> <li><a href="">One more nav</a></li> <li><a href="">Another nav item</a></li> </ul> </div> </div>
解决方法
使用面板和折叠插件制作简单的手风琴会不会更好?这是一个展示我的意思的例子.它做我认为你想要的.
<div class="row"> <div class="col-sm-3 col-md-2 sidebar"> <ul class="nav nav-sidebar"> <li> <div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapSEOne"> More </a> </h4> </div> <div id="collapSEOne" class="panel-collapse collapse in"> <div class="panel-body"> <ul> <li><a href="#">Blog</a></li> <li><a href="#">About US</a></li> <li><a href="#">Jobs</a></li> </ul> </div> </div> </div> </div> </li> <li><a href="">Nav item again</a></li> <li><a href="">One more nav</a></li> <li><a href="">Another nav item</a></li> </ul> </div> </div>
原文地址:https://www.jb51.cc/js/157600.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。