Bootstrap Carousel没有响应(Jquery正确放置)

时间:2017-03-29 06:16:50

标签: javascript html twitter-bootstrap

我目前面临的问题是Bootstrap的旋转木马没有响应按下的导航按钮。我的大部分搜索答案都是Jquery在Bootstrap CDN之前没有正确使用。我甚至尝试从答案中复制粘贴其他代码片段,导航按钮仍无法正确响应点击。

<head>
<meta charset="utf-8">
<title><!--title--></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css" type="text/css"/>
</head>

只有第一张图片正确加载,并且轮播似乎被“冻结”。

非常感谢任何帮助。

小提琴:https://jsfiddle.net/7dv1wm1w/

2 个答案:

答案 0 :(得分:3)

您尚未包含bootstrap.min.js

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript></script>

更新了小提琴:https://jsfiddle.net/yogesh214/7dv1wm1w/1/

答案 1 :(得分:1)

我没有看到Bootstrap的Javascript文件,所以这是您的答案,为什么轮播无法正常工作。

getbootstrap.com上,您可以找到所有需要的文件。你总是需要的是CSS和JS。否则Bootstrap无法工作。

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>