2013-10-04 58 views
0

我有一個簡單的導航欄很好的崩潰。當菜單被摺疊我用下面的「自動隱藏」當我點擊一個menue項目菜單中的腳本:Bootstrap 2 ---> 3 navbar問題

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 
    $('.navbar-collapse.in').removeClass('.in').css('height', '0');      
}); 

這個工作在BS2完美的,但現在菜單將不會完全關閉了與我必須再次點擊切換按鈕才能再次打開它。可能有點難以察覺到這種差異,但看看第二張照片的底部。之前關閉

菜單:

菜單後

http://i.stack.imgur.com/tXeb8.png

接近:

http://i.stack.imgur.com/C1ZSu.png

的HTML:

<nav class="navbar navbar-default" role="navigation"> 
    <div class="navbar-header"> 
     <a class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
     </a> 
    </div> 

    <div class="collapse navbar-collapse"> 
     <ul id="myTab" class="nav navbar-nav"> 
      <li class="active"><a href="#tab1" data-toggle="tab">Tab1</a></li> 
      <li><a href="#tab2" data-toggle="tab">Tab2</a></li> 
      <li><a href="#tab3" data-toggle="tab">Tab3</a></li> 
      <li><a href="#tab4" data-toggle="tab">Tab4</a></li> 
      <li><a href="#tab5" data-toggle="tab">Tab5</a></li> 
      <li><a href="#tab6" data-toggle="tab">Tab6</a></li> 
      <li><a href="#tab7" data-toggle="tab">Tab7</a></li> 
     </ul> 
     <ul class="nav navbar-nav navbar-right"> 
      <li><a href="#tab8" data-toggle="tab">Tab8</a></li> 
     </ul> 
    </div> 
</nav> 
+0

你可以說這個問題更精確一點嗎? – meilke

+0

當我打開摺疊的導航欄並使用上面的腳本單擊導航欄關閉的選項卡。但是它不會像圖片2所示的完全接近。你是否和我在一起? – Magnecyl

+0

我正在測試在Windows 8和最新的鉻是具體=) – Magnecyl

回答

0

嘗試:

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 
     $('.navbar-collapse').collapse('toggle');      
}); 
+0

哈哈謝謝!奇蹟般有效! – Magnecyl