bootstrap3的carousel图片轮播为什么无法使用 30
<!doctypehtml><htmllang="en"><head><metacharset="UTF-8"><title>bootstrap3</title><lin...
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>bootstrap3</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap-carousel.js"></script>
<script type="text/javascript">
$('.carousel').carousel({
interval: 2000;
})
</script>
</head>
<body>
<div id="carousel-example" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#carousel-example" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example" data-slide-to="1"></li>
<li data-target="#carousel-example" data-slide-to="2"></li>
</ol><!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="http://bfsu.sinaapp.com/wp-content/themes/bfsu/i/homepix/home5.jpg" alt="..." />
<div class="carousel-caption">...</div>
</div>
<div class="item">
<img src="http://bfsu.sinaapp.com/wp-content/themes/bfsu/i/homepix/home2.jpg" alt="..." />
<div class="carousel-caption">...</div>
</div>
<div class="item">
<img src="http://bfsu.sinaapp.com/wp-content/themes/bfsu/i/homepix/home3.jpg" alt="..." />
<div class="carousel-caption">...</div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="right carousel-control" href="#carousel-example" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span></a>
</div>
<script>
$(function(){
$('.carousel').carousel();
});
</script>
</div>
</div>
</body>
</html> 展开
<html lang="en">
<head>
<meta charset="UTF-8">
<title>bootstrap3</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap-carousel.js"></script>
<script type="text/javascript">
$('.carousel').carousel({
interval: 2000;
})
</script>
</head>
<body>
<div id="carousel-example" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#carousel-example" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example" data-slide-to="1"></li>
<li data-target="#carousel-example" data-slide-to="2"></li>
</ol><!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="http://bfsu.sinaapp.com/wp-content/themes/bfsu/i/homepix/home5.jpg" alt="..." />
<div class="carousel-caption">...</div>
</div>
<div class="item">
<img src="http://bfsu.sinaapp.com/wp-content/themes/bfsu/i/homepix/home2.jpg" alt="..." />
<div class="carousel-caption">...</div>
</div>
<div class="item">
<img src="http://bfsu.sinaapp.com/wp-content/themes/bfsu/i/homepix/home3.jpg" alt="..." />
<div class="carousel-caption">...</div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="right carousel-control" href="#carousel-example" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span></a>
</div>
<script>
$(function(){
$('.carousel').carousel();
});
</script>
</div>
</div>
</body>
</html> 展开
- 你的回答被采纳后将获得：
- 系统奖励15（财富值+成长值）+难题奖励10（财富值+成长值）+提问者悬赏30（财富值+成长值）
3个回答
展开全部
是不是引用js、css顺序错误，必须css、然后是jquery.js，最后再是bootstrap.js
可以参考网页链接 看一下
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
需要引用bootstrap轮播的carousel.js
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
F12调一下，我的就是JQuery版本和bootstrap版本不匹配
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
