CSS3/HTML5 NavBar行爲...在菜單項被選中後，它可以設置爲「隱藏自己」嗎？

Question

（新手）這段代碼可以工作，但在用戶點擊後離開導航欄...我想讓屏幕滾動到用戶選擇的位置，並且導航欄不會出現...（在所有視口中寬度...）

<nav class="navbar navbar-default"> 
    <div class="container"> 
    <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-navbar-collapse-1"> <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" href=""><img src="img/logo-nav.png" data-at2x="img/logo-nav@2x.png" alt="site name"></a> disabled--> 
     </div> 
     <div class="collapse navbar-collapse" id="bs-navbar-collapse-1"> 
      <ul class="nav navbar-nav navbar-right"> 
       <li><a href="#Home">Home</a></li> 
       <li><a href="#Features">Features</a></li> 
       <li><a href="#Reviews">Reviews</a></li> 
       <li><a href="#Author">Author</a></li> 
       <li><a href="http://www.amazon.com/FOO COOKBOOK" class="button">Buy Now</a></li> 
      </ul> 
     </div> 
    </div> 
</nav> 

Answer 1

當然，但你可能不得不使用一點的JavaScript（JQuery）;

只是</head>標記之前添加以下代碼：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
     <script type="text/javascript"> 

     $(document).ready(function() { 
      $(".navbar-toggle").click(function(){ 
       $(".navbar-collapse").slideDown("slow") 
      }); 
     $("ul.nav > li > a").click(function() { 
    $(".navbar-collapse").slideUp("slow"); 
     }); 
}); 

     </script> 

另外，我想借此按鈕出來的 「容器」 的。