<分区>
<分区>
我正在使用 Twitter Bootstrap 3 将我的网页缩放到任何屏幕尺寸,并且在按下触发按钮时导航栏不会扩展。
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified CSS: Bootstrap 3 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript:Bootstrap 3 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> </script>
<meta charset="utf-8">
<title>Webpage</title>
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand">Webpage</a>
<button type="button" class="navbar-toggle" data-target=".navbar-collapse" data-toggle="collapse" aria-expanded="false" aria-controls="navbar3">
<span class="sr-only">Toggle nav</span>
<span class="glyphicon glyphicon-plus-sign"></span>
</button>
</div>
<ul class="nav navbar-nav collapse navbar-collapse">
<li class="active"><a href="/p1">Page1</a></li>
<li><a href="/p2">Page2</a></li>
<li><a href="/p3">Page3</a></li>
</ul>
</div>
</nav>
<div id="content">
</div>
</body>
</html>
出了什么问题,我该如何解决?
最佳答案
jQuery 需要先加载,这样它的依赖项才能使用该库。由于 bootstrap.min.js
依赖于 jQuery,因此您应该在 AFTER 加载 jQuery 后加载它。
只需移动您的 jQuery 文件 jquery.min.js
before 您的 bootstrap js 文件 bootstrap.min.js
并且您的导航栏应该可以正常工作.
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> </script>
<!-- Latest compiled and minified JavaScript:Bootstrap 3 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
关于jquery - Bootstrap 3 导航栏不扩展,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38030727/