两个Bootstrap导航菜单同时出现

amy*_*amy 6 javascript css less collapse twitter-bootstrap

我想知道它是否可以同时拥有两个导航.

这是一个带有bootstrap测试的JSFiddle,只有导航栏的折叠JavaScript.两个菜单同时扩展,有没有办法防止这种情况?

And*_*ich 17

您可以,您所要做的就是将data-target属性与下拉菜单的唯一类或ID区分开来,如下所示:

第一次下拉

<a class="btn btn-navbar" data-toggle="collapse" data-target="#first">
Run Code Online (Sandbox Code Playgroud)

第二次下拉:

<a class="btn btn-navbar" data-toggle="collapse" data-target="#second">
Run Code Online (Sandbox Code Playgroud)

然后,您可以将该唯一ID添加到导航折叠容器中:

第一

<div id="first" class="nav-collapse"> ... </div>
Run Code Online (Sandbox Code Playgroud)

第二

<div id="second" class="nav-collapse"> ... </div>
Run Code Online (Sandbox Code Playgroud)

演示:http://jsfiddle.net/F2tYu/3/