Bootstrap 3崩溃菜单不工作(常见问题)



我对小宽度屏幕的菜单有一个问题,即,一旦它崩溃。当我点击"汉堡"符号时,什么也没有出现。我看过大多数与此有关的帖子,但找不到解决方案。从更改HTML到添加CSS,再到调用不同的jquery脚本。我使用的是"bootstrap-3.3.1"框架和"jquery/1.11.2"脚本。导航条和脚本的代码如下:

<nav class="navbar navbar-default navbar-fixed-top normal" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-logo" href="#"><img class="img-responsive" src="img/logo.svg"></a>
    </div>
    <div id="navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav navbar-right">
        <li><a href="index.html">Home</a></li>
        <li><a href="services.html">Services</a></li>
        <li class="active"><a href="photos.html">Photos</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</nav>

<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="../../dist/js/bootstrap.min.js"></script>

原因是因为我引用了"bootstrap "。"Min"是不正确的。它应该是:

 <script src="js/bootstrap.min.js"></script>

或者如果使用链接(在本例中是3.3.5版本):

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

要解决您的问题,您需要做以下操作:-

添加2.1.4版本的Jquery,因为要使用最新的Bootstrap版本3.3.1,你必须使用以上的Jquery最新版本

希望在添加这个jquery版本后你的问题得到解决。

从下面的链接获取Jquery版本:-Jquery2.1.4

最新更新