我一直在尝试使用 Bootstrap Carousel,并在一定程度上取得了成功。我也可以单击并更改图像。但是我有一个问题。就是不滑动!我哪里做错了?
html:
<div id="my_carousel" class="carousel slide">
<ol class="carousel-indicators">
<li data-target = "#my_carousel" data-slide-to = "0" class="active"></li>
<li data-target = "#my_carousel" data-slide-to = "1"></li>
<li data-target = "#my_carousel" data-slide-to = "2"></li>
</ol>
<div class="carousel-inner i">
<div class="item active">
<img src="images/f3.jpg" alt = "i1" class="img-responsive">
</div>
<div class="item">
<img src="images/f2.jpg" alt = "i2" class="img-responsive">
</div>
<div class="item">
<img src="images/f1.jpg" alt = "i3" class="img-responsive">
</div>
</div>
<a class="carousel-control left" href="#my_carousel" data-slide = "prev">
<span class="icon-prev left"></span>
</a>
<a class="carousel-control right" href="#my_carousel" data-slide = "next">
<span class="icon-next right"></span>
</a>
</div>
编辑:
j查询:
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$('.carousel').carousel({
interval: 3000
})
});
</script>
<script language="JavaScript" type="text/javascript" src="scripts/jquery.js"></script>
<script language="JavaScript" type="text/javascript" src="scripts/bootstrap.min.js"></script>
最佳答案
您是否包含此脚本:
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$('.carousel').carousel({
interval: 2000
})
});
</script>
即使它不起作用,请在调用 jquery 之前检查您是否正在调用上面的脚本。所以,它应该是这样的:
<!-- Calling jquery first -->
<script language="JavaScript" type="text/javascript" src="scripts/jquery.js"></script>
<script language="JavaScript" type="text/javascript" src="scripts/bootstrap.min.js"></script>
<!-- Carousel -->
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$('.carousel').carousel({
interval: 3000
})
});
</script>
关于jquery - Bootstrap 轮播不滑动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22152206/