Bootstrap响应菜单不工作

我从这里的答案中的一个在stackoverflow中获得此代码，但它似乎没有对我工作？当菜单按钮出现，我点击它，除了它改变颜色，什么也没有发生。请帮助这里是我使用的代码。谢谢Bootstrap响应菜单不工作

<header class="row"> 
    <div class="col-md-5"> 
     <a href="index.html"><img class="pull-left img-responsive" src="view/images/logo.png" alt=""></a> 
    </div> 
    <div class="col-md-7"> 
     <nav class="navbar navbar-default pull-right" role="navigation"> 


<div class="navbar-header"> 
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> 
    <span class="sr-only">Toggle navigation</span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </button> 
</div> 

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
<ul class="nav nav-pills head-menu"> 
    <input type="hidden" id="selected_menu_item" value="=$selectedMenuId; ?>" />        
    <li> 
     <a href="#" id="welcome"> 
     The Institution    
     </a> 
    </li> 
     <li><a href="#" id="kitchen">Our Offerings</a></li> 
     <li><a href="#" id="programma" >Events</a></li> 
     <li><a href="#" id="foodart" >Contact Us</a></li> 
</ul> 
</div>

<script src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script src="js/bootstrap.min.js"></script> 
<script> 
//Stack menu when collapsed 
$('#bs-example-navbar-collapse-1').on('show.bs.collapse', function() { 
$('.nav-pills').addClass('nav-stacked'); 
}); 

//Unstack menu when not collapsed 
$('#bs-example-navbar-collapse-1').on('hide.bs.collapse', function() { 
    $('.nav-pills').removeClass('nav-stacked'); 
}); 
</script>

什么可能会丢失？

来源

2015-05-01 Nnn

你有没有解决过这个问题？我有同样的问题。 – Dave

是的！我会在答案上发布它，以便我可以理解代码@Dave – Nnn

谢谢，事实证明，我只需要Bootstrap的Collapse js组件。在Bootstrap Customizer网站下载它，并开始工作。 – Dave

其实我只是复制这个从以前的网站，我没有，所以我真的不知道问题是什么，但它的工作这么...

<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> 
<title>GreatnessLab - Education for a Better World</title> 

<!-- Bootstrap --> 
<link href="view/css/bootstrap.min.css" rel="stylesheet"> 
<link href="view/css/styles.css" rel="stylesheet"> 
<link href="http://fonts.googleapis.com/css?family=Archivo+Narrow" rel="stylesheet" type="text/css"> 
<link rel='shortcut icon' type='image/x-icon' href='favicon.ico' /> 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
<script src="js/respond.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

来源

2015-05-15 16:43:45 Nnn

Bootstrap响应菜单不工作

回答

相关问题