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

回答

相關問題