Bootstrap導航菜單問題

-1

我是Bootstrap的新手，我只是通過閱讀在線教程和文檔來探索它。我只是想創建一個小POC來理解它。Bootstrap導航菜單問題

首先問

請看看我的截圖：

enter image description here

正如你所看到的，在鏈接的彈出菜單對準左側。有沒有辦法讓這個彈出右邊？我試圖把拉右班，但無濟於事。

我創建了一個fiddle

 <ul class="nav navbar-nav navbar-right"> 
     <li class="active"><a href="#">Home</a></li> 
     <li class="dropdown"> 
     <a href="#" class="dropdown-toggle" data-toggle="dropdown">Link<span class="caret"></span></a> 
     <ul class="dropdown-menu" role="menu"> 
      <li><a href="#">Action</a></li> 
      <li><a href="#">Another action</a></li> 
      <li><a href="#">Something else here</a></li> 
      <li class="divider"></li> 
      <li><a href="#">Separated link</a></li> 
      <li class="divider"></li> 
      <

第二個問題

我從我的讀數引導不支持，因爲可用性問題多層次的下拉菜單看到。我只是想如何解決此，假設我有一個頂層部門鏈接

+ Departments 
    - Finance 
    - Billing 
    - Accounting 
    - Engineering 
    - IT 
    - General Service

我想縮進結算/財務/ IT /一般事務和被點擊保持金融和工程部門。我看到一些能夠支持多級下拉的解決方法，但由於它是bootstrap建議，因此我儘可能多地遵循它。有什麼想法嗎？

來源

2014-09-26 Mark Estrada

嗨，馬克。克里斯蒂娜在任何幫助下的冗長答案？它似乎仍然沒有迴應。 – halfer 2017-09-18 10:39:32

（遺憾的是，downvoted - 見上面，請願意回覆並在這裏互動 - 我們依靠善意和遊戲化來保持答案滾動。感謝您考慮此事）。 – halfer 2017-10-04 14:34:13

首先，您需要查看構建在Bootstrap 3.x上的多級單擊菜單。這裏有一個http://jsbin.com/pavopa/1/edit，我從Bootply複製過來。它需要CSS工作。你可能會發現其他人已經完成了。不要使用懸停或涉及懸停的解決方案。屏幕尺寸並不意味着它是一個移動設備。

如果您使用的是navbar-right，則下拉菜單在右側對齊，而彈出對面，如果您使用navbar-left下拉菜單，則左側對齊。因此，改變這將涉及進入Bootstrap CSS並在其發生的最小寬度中進行調整。這也不是一個好主意，因爲最後一個項目和其他項目，取決於寬度，可能會關閉屏幕，人們將無法使用它。

引導程序的組件不會自動檢測視口的邊緣，大多數菜單系統都不會。

的引導，導航功能，與幾乎所有的點擊導航系統的方法：要顯示爲下拉，不能在同一時間，除非你的鏈接和切換

+ Departments : this is NOT a link 
    + Finance : this NOT a link 
    - Billing 
    - Accounting

什麼違背正常的用戶體驗，並使文本成爲鏈接，箭頭切換。

如果你有「財經」部分信息，使你的第一個網頁，如：

+ Departments : Not a link 
    + Finance : Not a link 
    - Finance Overview 
    - Billing 
    - Accounting

來源

2014-09-26 13:41:08 Christina

Bootstrap導航菜單問題

回答

相關問題