Bootsrap汉堡包菜单Jquery

我创建了一个Bootstrap导航栏，并希望它能够在网页显示在手机上时导航栏仍然有效。因为它现在是按钮出现，但是当你点击它时没有任何反应。我看了一下Code Pen（http://codepen.io/macsupport/pen/bKFzD），但他们的例子也不起作用。Bootsrap汉堡包菜单Jquery

<nav class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="true" 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-brand" >Leeds Market</a> 
     </div> 
     <div id="navbar" class="collapse navbar-collapse"> 
      <ul class="nav navbar-nav"> 
      <li class="active"><a href="homepage.php">Home</a></li> 
      <li><a href="about.php">About</a></li> 
      <li><a href="stalls.php">Stalls</a></li> 
      <li><a href="products.php">Products</a></li> 
      <li><a href="basket.php">Basket</a></li> 
      </ul> 
      <form class="navbar-form navbar-right" method="post" action="loginsql.php" > 
      <div class="form-group"> 
       <input type="text" placeholder="Username" name="Username" class="form-control"> 
      </div> 
      <div class="form-group"> 
       <input type="password" placeholder="Password" name="Password" class="form-control"> 
      </div> 
      <button type="submit" class="btn btn-success">Sign in</button> 
      <a href="register.php" class="btn btn-success" role="button">Register</a> 
     <a href="traderlogin.php" class="btn btn-success" role="button">Trader</a> 
      </form> 
     </div><!--/.navbar-collapse --> 
     </div> 
    </nav>

来源

2015-05-08 TheKaiser4

是否包含引导JavaScript文件？没有它，互动什么也不做，它看起来很漂亮。 – Sukima

将bootstrap.js，bootsrap.min.js和npm.js文件上传到服务器，它们如何包含它们？ – TheKaiser4

确保包含jQuery和bootstrap，就像@Sukima提到的一样。您可以包含在您的服务器上，或使用CDN版本。 https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min .js文件 – cfnerd

，包括那些在你的页面的<head>：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

来源

2015-05-08 13:54:35 Ted

Bootsrap汉堡包菜单Jquery

回答

相关问题