如何讓 Twitter Bootstrap 下拉選單出現在懸停而不是點擊時？

懸停觸發Twitter Bootstrap 選單下拉選單

使用Twitter Bootstrap 時，可以在懸停時自動下拉選單，而不需要單擊。這是透過 CSS 修改實現的。

要在懸停時啟動下拉式選單，請將選擇器定位為隱藏式選單選項。例如，如果使用 Twitter Bootstrap 頁面中的範例：

ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;    
}

但是，如果使用響應式功能，則當導覽列在較小螢幕上折疊時，您需要排除此功能。將上述程式碼包含在媒體查詢中：

@media (min-width: 979px) {
  ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
  }
}

刪除下拉箭頭

要隱藏箭頭（插入符號），請將其從下拉切換錨點中刪除元素，取決於您的Twitter 版本Bootstrap：

• Bootstrap 3： 從元素中刪除 HTML 。
• Bootstrap 2 及更低版本： 使用CSS定位並設定:after 偽樣式的樣式元素：

a.menu:after, .dropdown-toggle:after {
    content: none;
}

請記住了解這些概念如何工作並嘗試程式碼以根據需要自訂行為。

以上是如何讓 Twitter Bootstrap 下拉選單出現在懸停而不是點擊時？的詳細內容。更多資訊請關注PHP中文網其他相關文章！