Twitter的引導響應菜單/小型設備：在單擊菜單項

我想改變在小型設備上的Twitter的引導菜單的行爲通過單擊菜單項上，關閉展開的菜單或者點擊菜單關閉/摺疊菜單按鈕。目前（默認）我只能通過點擊右上角的菜單按鈕來摺疊它，無論是否點擊鏈接/菜單項。我會怎麼做？我沒有從結核病文件中找出結果，並且搜索互聯網沒有提供任何答案。Twitter的引導響應菜單/小型設備：在單擊菜單項

來源

2013-06-03 gfaw

你可以嘗試像..

$('.nav li a').on('click',function(){ 
    $('.nav-collapse').collapse('hide'); 
})

這將爲那些引用「＃」菜單鏈接工作。如果您的菜單鏈接導航到網站上的另一個頁面，菜單應該已經崩潰，因爲這會導致整個頁面刷新。

來源

2013-06-03 16:37:23 ZimSystem

謝謝斯凱利！我會嘗試。問題是我有一個頁面網站，它使用錨點，因此鏈接不會從當前頁面導航，因此不會刷新頁面。 – gfaw

真的這麼做！再次感謝！ – gfaw

這是一個很好的答案。我不知道默認的引導邏輯崩潰的菜單使用單頁的應用程序時不工作（上一個Angular.JS應用程序等。）我不得不使用$（」。Navbar的崩潰‘）。崩潰（’隱藏「）;而不是「導航崩潰」，但否則這就像一個魅力。 –

感謝修復斯凱利。它在「移動」菜單上運行良好，但不幸的是，它在「桌面」模式下導致視覺缺陷，因爲它瞄準.nav-collapse，並且該類在兩種模式下均處於活動狀態。所以，我做了輕微的修改：

$('.nav li a').on('click',function(){ 
    $('.navbar-collapse.in').collapse('hide'); 
})

當菜單處於「移動」模式，此修改將僅援引「隱藏」功能。

注：這僅在引導3.

來源

2013-11-01 14:35:55 JCarmine

在Bootstrap 3.0中完美工作。謝謝！ – plang

我搜索了很多這個答案非常感謝你這是非常有益的。 – RPDeshaies

測試你可以通過使用HTML，添加data-toggle="collapse" data-target=".in"錨

例子：

<li><a href="#" data-toggle="collapse" data-target=".in">Link</a></li>

來源

2014-04-28 21:11:03

這絕對是最好的答案。簡單。謝謝。 – Batman

Twitter的引導響應菜單/小型設備：在單擊菜單項

回答

相關問題