2015-10-28 123 views
0

我已搜索解決方案並失敗。我提前爲這樣一個新手提出道歉問題。點擊時的切換不會擴展到菜單項。我在「主頁」頁面上工作,但無法在鏈接的頁面上執行此操作。代碼幾乎與功能切換一樣,是頁面結尾的正文中的java腳本。任何幫助將不勝感激。摺疊式開關不起作用

<div class="container-fluid"> 
<!-- Brand and toggle get grouped for better mobile display --> 
<div class="navbar-header"> 
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapse-3" aria-expanded="false"> 
    <span class="sr-only">Toggle navigation</span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </button> 
</div> 

    <!-- Collect the nav links, forms, and other content for toggling --> 
<div class="collapse navbar-collapse navbar-collapse" id="collapse-3"> 
<ul class="nav navbar-nav"> 
    <li><a href="../Lark_home_page2.html">Home</a></li> 
    <li><a href="../Lark_User_Objects.zip">Download</a></li> 
    <li><a href="../Lark_tutorials/Lark_tutorials.html">Tutorials</a></li> 
    <li><a href="Lark_resources.html">Resources</a></li> 
    <li><a href="mailto:[email protected]">Contact Us</a></li> 
    </ul> 
    </div><!-- /.navbar-collapse --> 

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
<script src="js/jquery-1.11.2.min.js"></script> 
<!-- Include all compiled plugins (below), or include individual files as needed --> 
<script src="js/bootstrap.min.js"></script> 
+0

在撒哈拉目錄中的鏈接的網頁?你可能有一個相對路徑問題。 – zero298

回答

0

你缺少<nav class="navbar navbar-default"></div>包裝:

/* Latest compiled and minified CSS included as External Resource*/ 
 

 
/* Optional theme */ 
 

 
@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css'); 
 
body { 
 
    margin: 10px; 
 
}
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" /> 
 
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<nav class="navbar navbar-default"> <!-- you are missing this line--> 
 
    <div class="container-fluid"> 
 
    <!-- Brand and toggle get grouped for better mobile display --> 
 

 
    <div class="navbar-header"> 
 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> 
 
     <span class="sr-only">Toggle navigation</span> 
 
     <span class="icon-bar"></span> 
 
     <span class="icon-bar"></span> 
 
     <span class="icon-bar"></span> 
 
     </button> 
 
    </div> 
 
    <!-- Collect the nav links, forms, and other content for toggling --> 
 
    <div class="collapse navbar-collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
 
     <ul class="nav navbar-nav"> 
 
     <li><a href="../Lark_home_page2.html">Home</a> 
 
     </li> 
 
     <li><a href="../Lark_User_Objects.zip">Download</a> 
 
     </li> 
 
     <li><a href="../Lark_tutorials/Lark_tutorials.html">Tutorials</a> 
 
     </li> 
 
     <li><a href="Lark_resources.html">Resources</a> 
 
     </li> 
 
     <li><a href="mailto:[email protected]">Contact Us</a> 
 
     </li> 
 
     </ul> 
 
    </div> 
 
    <!-- /.navbar-collapse --> 
 

 
    </div><!-- you are missing this line-->