私のナビゲーションバーが小さなウィンドウで崩壊しない理由は何ですか？

Question

私はナビゲーションバーを作成し、それを私の方法でスタイルしました。しかし、ウィンドウを小さくして、ボタンの右隅をクリックすると、ナビゲーションバーがすべてのオプションを拡張し、それだけです。オプションの1つをクリックすると、閉じることはできません。つまり、元に戻すことはできません。私は間違って何をしていますか？私はこれでしばらくの間探検しており、間違いを見ることはできません。ここで

が私のコードです：私のindex.htmlで

<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=".navbar-ex1-collapse">  
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
     </button> 
     <!-- use a responsive image option so this logo looks good on devices - recommend using something like retina.js --> 
     <a class="navbar-brand" href="#/">Test</a> 
    </div> 

    <!-- Collect the nav links, forms, and other content for toggling --> 
    <div class="collapse navbar-collapse navbar-ex1-collapse"> 
     <ul class="nav navbar-nav navbar-right"> 
      <li><a href="#/home">Home</a> 
      </li> 
      <li><a href="#/about">About Us</a> 
      </li> 
      <li><a href="#/services">What We Do</a> 
      </li> 
      <li><a href="#/example">Examples</a> 
      </li> 
      <li><a href="#/testimonials">Testimonials</a> 
      </li> 
      <li><a href="#/contact">Contact Us</a> 
      </li> 
     </ul> 
    </div> 
    </div> 
</nav> 

、私は正常に動作header.html、および次のスタイルにリンクされています

<link rel="stylesheet" href="css/bootstrap.min.css"> 
    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> 

そして、 javascript：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"> </script> 
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 

Answer 1

リンクをクリックしても、ブートストラップナビバーが自動的に折りたたまれたり、切り替えたりすることはありません。これは設計によるものです。

あなたは彼らがあなたがリンクにこれを追加することができますクリックした後に閉じるようにしたい場合は...

data-toggle="collapse" data-target=".navbar-collapse.in"

デモ：http://www.codeply.com/go/Ia4LLB8Yyp

ます。また、このようにjQueryを使用することができます。..

$(document).on('click','.navbar-collapse.in',function(e) { 
    if($(e.target).is('a')) { 
     $(this).collapse('hide'); 
    } 
}); 

を