導航欄切換按鈕不起作用

當我在移動視圖中縮小我的屏幕時，我的切換按鈕不起作用。你能告訴我原因嗎？導航欄切換按鈕不起作用

這是我的代碼。預先感謝您。

<nav class="navbar navbar-default mmn-navbar"> 
 
    <div class="container-fluid"> 
 
     <div class="navbar-header"> 
 
      <button type="button" class="navbar-toggle mmn-navbar-toggle collapsed" data-toggle="collapse" data-target="#nav-collapse" aria-expanded="false" style="border: none;"> 
 
       <span class="sr-only">Toggle navigation</span> 
 
       <span class="icon-bar" style="height: 7px;border-radius: 0;width: 40px;background: white;"></span> 
 
       <span class="icon-bar" style="height: 7px;border-radius: 0;width: 40px;background: white;"></span> 
 
       <span class="icon-bar" style="height: 7px;border-radius: 0;width: 40px;background: white;"></span> 
 
      </button> 
 
      <a class="navbar-brand managemyngo-font" style="color: white; padding: 1em;" href="#">ManageMyNGO</a> 
 
     </div> 
 
     <div class="collapse navbar-collapse" id="nav-collapse" style="border: none;"> 
 
      <div class="nav navbar-nav navbar-right menu-font menu" style="color: white;"> 
 
       <?php 
 
        wp_nav_menu(array( 
 
         'theme_location' => 'header-menu', 
 
         'container' => 'nav', 
 
         'container_class' => 'topnav' 
 
        )); 
 
       ?> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</nav>

來源

2017-02-09 Swarnima Gupta

<html> 
 
<head> 
 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
      <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
      </head> 
 
      <body> 
 

 
    <nav class="navbar navbar-inverse mmn-navbar"> 
 
       <div class="container-fluid"> 
 
       <div class="navbar-header"> 
 
        <button type="button" class="navbar-toggle mmn-navbar-toggle collapsed" data-toggle="collapse" data-target="#nav-collapse" aria-expanded="false" style="border: none;"> 
 
        <span class="sr-only">Toggle navigation</span> 
 
        <span class="icon-bar" style="height: 7px;border-radius: 0;width: 40px;background: white;"></span> 
 
        <span class="icon-bar" style="height: 7px;border-radius: 0;width: 40px;background: white;"></span> 
 
        <span class="icon-bar" style="height: 7px;border-radius: 0;width: 40px;background: white;"></span> 
 
        </button> 
 
        <a class="navbar-brand managemyngo-font" style="color: white; padding: 1em;" href="#">ManageMyNGO</a> 
 
       </div> 
 
       <div class="collapse navbar-collapse" id="nav-collapse" style="border: none;"> 
 
        <div class="nav navbar-nav navbar-right menu-font menu" style="color: white;"> 
 
         <?php 
 
         wp_nav_menu(array( 
 
           'theme_location' => 'header-menu', 
 
           'container' => 'nav', 
 
           'container_class' => 'topnav' 
 
           )); 
 
         ?> 
 
        </div> 
 
       </div> 
 
       </div> 
 
      </nav> 
 
    </body> 
 
    </html>

它似乎是工作的罰款。我只是將navbar-default更改爲navbar-inverse，只是爲了使切換菜單可見。確保您的頁面中不包含bootstrap cdn's兩次。

來源

2017-02-09 07:04:15 neophyte

嘿，它的工作我沒有包括bootstrap.min.js 謝謝:) –

導航欄切換按鈕不起作用

回答

相關問題