navbar不能在移動網絡應用程序工作

Question

我有一個簡單的頁面滾動nabber。它在桌面上工作，但當我在移動web應用程序中查看它時，它甚至不顯示菜單或切換導航。我相信我錯過了一些關於移動視圖的東西，但不確定。我檢查了堆棧溢出的帖子，但沒有幫助。請參考以下

<nav class="navbar navbar-default navbar-fixed-top" 
style="background-color: #757470; padding-left: 0px; margin: 0px; height: 64px;"> 
<div class="container" id="menu"> 
    <!-- Brand and toggle get grouped for better mobile display --> 
    <div class="navbar-header page-scroll"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" 
      data-target="#bs-example-navbar-collapse-1"> 
      <span class="sr-only">Toggle navigation</span> 
     </button> 
    </div> 
    <div class="collapse navbar-collapse" 
     id="bs-example-navbar-collapse-1" 
     style="font-family: Lato; font-size: 12px;" class="gatewayNav"> 
     <ul class="nav navbar-nav" 
      style="padding-top: 0px; padding-left: 0px;"> 
      <li><div style="" class="gatewayLogo"></div> 
       <h1 style="padding-left: 200px;"></h1></li> 
      <li class="dropdown"><a data-toggle="tab" href="#home" 
       id="homeMenu" prevent-default="" scroll-to="home" 
       style="border: medium none; padding-top: 10px; padding-bottom: 0px;"><b 
        style="color: white; font-size: 13px;">HOME</b><br> </a></li> 
      <li class="dropdown"><a data-toggle="tab" href="#startups" 
       prevent-default="" scroll-to="startups" 
       style="border: medium none; padding-top: 10px; padding-bottom: 0px; color: white;" 
       id="startupMenu"><b style="color: white; font-size: 13px;">STARTUPS</b> 
        <br> </a></li> 
     </ul> 
    </div> 
</div> 

Answer 1

導航欄的代碼片段首先確保你第一次加載jQuery和那之後引導的JavaScript。如果你有這些正確加載，那麼你的問題可能是幾個不同的問題。一個是，如果你沒有看到切換按鈕，你可能會有一些自定義的css作爲你的切換按鈕，使它沒有邊界或者這種效果。如果沒有按鈕中的<span class="icon-bar"></span>元素，您可能看不到切換按鈕。接下來我看到的是你有一個爲導航欄設置的高度。如果您看到切換按鈕，並且點擊它後，您看不到下拉菜單，因爲您有白頁。您可能需要考慮添加填充以獲得所需的高度，而不是給它一個高度。

這裏是你的導航工作的小提琴。我添加了7px的頂部和底部填充，因爲引導程序3的導航欄是50px，因此要獲得64px，您只需在頂部和底部添加7。然後我將圖標欄添加到切換按鈕，以便您可以看到它。就像我說的，但請確保您先加載jquery，然後再啓動js文件。這裏是小提琴演示JsFiddle Navbar Fix

PS，如果你不打算爲每個在你的導航欄你<li>元素的下拉菜單則沒有理由下拉類添加到<li>。當你點擊你的鏈接並且所有的分頁符和奇怪的填充都可能導致一些問題時，你也將切換選項卡或滾動到一個部分。請在這個答案後留下評論，這樣我就能理解你所要達到的目標，因爲看起來你對這個標記有很多相互衝突的問題，我只是想了解你正在嘗試做什麼也許我可以幫忙。