Bootstrap导航栏切换不起作用 [英] Bootstrap navbar toggle is not working

问题描述

我设计了网页并使用了bootstrap导航栏切换。它不工作，

任何人都可以帮我解决这个问题。？

I designed webpage and used bootstrap navbar toggle. IT is not working,
Can anyone help me to solve the issue.?

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
                   <div class="container">

                       <div class="navbar-header">
                           <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                               <span class="sr-only">Toggle navigation</span>
                               <span class="icon-bar"></span>
                               <span class="icon-bar"></span>
                               <span class="icon-bar"></span>
                           </button>
                   <a href="index.html" class="logo"><img src="../images/logo.png" alt="ColorsDress Logo"/></a>
                       </div>

                       <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                           <ul class="nav navbar-nav navbar-right custom-menu">
                               <li class="active"><a href="index.html">HOME</a></li>
                               <li><a href="collection.html">COLLECTION</a></li>
                               <li><a href="shows.html">SHOWS</a></li>
                               <li><a href="storelocater.html">STORE LOCATOR</a></li>
                               <li><a href="aboutus.html">ABOUT US</a></li>
                               <li><a href="contactus.html">CONTACT US</a></li>
                               <li><a href="#">LIVE INVENTORY</a></li>
                           </ul>
                       </div>

                   </div>
               </nav>

提前致谢。

Thanks in advance.

推荐答案

您忘了将折叠的类添加到导航栏切换按钮。



另外，make确定你已经包含了所需的css& js文件如下



Bootstrap CDN [ ^ ]

You forgot to add the collapsed class to the navbar-toggle button.

Also, make sure you have included the needed css & js files like below

Bootstrap CDN[^]

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"></link>

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"></link>

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

演示： FIDDLE [ ^ ]

（尝试调整大小窗口以查看它的运行情况并单击右上角的图标）

DEMO: FIDDLE[^]
(Try to resize the window to see it in action and click the top right icon)

您是否已包含 jQuery Core 您的代码中的库JS文件？

如果您还没有在 bootstrap.js之前包含它



-KR

Have you included jQuery Core Library JS file in your code ?
If you haven't then include it before your bootstrap.js

-KR

这篇关于Bootstrap导航栏切换不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！