2016-10-30 17 views
-1

ドロップダウンのボタンをクリックしようとするたびに、何もしません。おそらく簡単な間違いです。クリック時にブートストラップドロップダウンメニューが機能しない

<!doctype html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]--> 

    <title>Module 3 Solutions</title> 
    <link rel="stylesheet" href="css/bootstrap.min.css"> 
    <link rel="stylesheet" href="css/styles.css"> 
    </head> 
<body> 

<!-- alllllll this in the bottom is the nav bar code 
***************************************************** 
***************************************************** 
*****************************************************--> 

<header> 
    <div class="navbar navbar-default"> 
     <div class="container"> 
      <div class="navbar-brand">Food LLC</div> 

      <button class="navbar-toggle" data-toggle="collapse" data-target= ".navHeaderCollapse"> 


      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"> </span> 
      </button> 


      <div class="collapse navbar-collapse navHeaderCollapse"> 
       <ul class="nav navbar-nav navbar-right"> 
       <li><a href="#">Menu</a></li> 


      </ul> 

      </div> 

     </div> 
    </div> 








</header>    

</body>    



<h1 id="text-center">Our Menu </h1> 

<body> 

<div id="C-title">Chicken</div> 
<p> 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
</p> 


<div id="B-title">Beef</div> 
<p> 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
</p> 


<div id="S-title">Sushi</div> 
<p> 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
100% 100% 100% 100% 100% 100% 100% 
</p> 




















    <!-- jQuery (Bootstrap JS plugins depend on it) --> 
    <script src="js/jquery-1.11.3.min.js"></script> 
    <script src="js/bootstrap.min.js"></script> 
    <script src="js/script.js"></script> 



</body> 
</html> 
+0

あなたがカップルを使用しているようです – Banzay

+0

Tnxはい私はそれを削除しましたが、それでも問題を解決しませんでした –

答えて

0

、この構造を使用してください:

<nav class="navbar navbar-inverse"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">WebSiteName</a> 
    </div> 
    <div class="collapse navbar-collapse" id="myNavbar"> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#">Home</a></li> 
     <li><a href="#">Page 1</a></li> 
     <li><a href="#">Page 2</a></li> 
     <li><a href="#">Page 3</a></li> 
     </ul> 
     <ul class="nav navbar-nav navbar-right"> 
     <li><a href="#"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li> 
     <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li> 
     </ul> 
    </div> 
    </div> 
</nav> 
0

は私のミスを発見!!!!!

私のインデックスページで私はjquery-1.11を使用していて、古いものも私のJSフォルダにダウンロードされました。私は単に現在のバージョンjquery-3.1.1.min.jsとBOOOOM !!!!!!をダウンロードしました。問題が解決しました私のメニューのドロップダウンメニューがあります!!!!!

関連する問題