如何獲取可摺疊導航欄的工作方式？

Question

我使用twitter bootstrap，當我將瀏覽器窗口的寬度減小到一定大小時，我看到下面的圖像。但是，當我點擊它並沒有任何反應時。我通常有2個元素，但當寬度太小時看不到它們。如何通過從顯示中刪除按鈕或者顯示按鈕來解決這個問題，然後在點擊時顯示2個項目？

Answer 1

從顯示停止按鈕，您可以在下面的代碼添加到你的CSS：

.navbar .btn-navbar{ 
    display:none; 
    } 

此外，您瞭解更多信息可go through this article和幫助..

Answer 2

確保你有自適應引導CSS和崩潰JavaScript插件每引導文檔：

擡頭！響應式導航欄需要摺疊插件和 響應式Bootstrap CSS文件。

而且，這裏是它的工作的一個例子（已經引導響應CSS和JS引導參考）： http://jsfiddle.net/ZdVcg/

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet"> 
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script> 
<div class="navbar"> 
<div class="navbar-inner"> 
<div class="container"> 

    <!-- .btn-navbar is used as the toggle for collapsed navbar content --> 
    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </a> 

    <!-- Be sure to leave the brand out there if you want it shown --> 
    <a class="brand" href="#">Project name</a> 

    <!-- Everything you want hidden at 940px or less, place within here --> 
    <div class="nav-collapse collapse"> 
    <!-- .nav, .navbar-search, .navbar-form, etc --> 
     <ul class="nav"> 
      <li class="active"><a href="#">Home</a> 
      </li> 
      <li><a href="#">Link</a></li> 
      <li><a href="#">Link</a></li> 
     </ul> 

    </div> 

</div> 
</div> 
</div>​