Bootstrap传送带不能滑动 [英] Bootstrap carousel not sliding
本文介绍了Bootstrap传送带不能滑动的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
html:
< div id =my_carouselclass =carousel slide>
< li data-target =#my_carouseldata-slide-to =0class =active>< / li>
< li data-target =#my_carouseldata-slide-to =1>< / li>
< li data-target =#my_carouseldata-slide-to =2>< / li>
< / ol>
< div class =carousel-inner i>
< div class =item active>
< img src =images / f3.jpgalt =i1class =img-responsive>
< / div>
< div class =item>
< img src =images / f2.jpgalt =i2class =img-responsive>
< / div>
< div class =item>
< img src =images / f1.jpgalt =i3class =img-responsive>
< / div>
< / div>
< a class =carousel-control lefthref =#my_carouseldata-slide =prev>
< span class =icon-prev left>< / span>
< / a>
< span class =icon-next right>< / span>
< / a>
< / div>
编辑:
< script language = JavaScripttype =text / javascript>
$(document).ready(function(){
$('。carousel')。carousel({
interval:3000
})
});
< / script>
< script language =JavaScripttype =text / javascriptsrc =scripts / jquery.js>< / script>
< script language =JavaScripttype =text / javascriptsrc =scripts / bootstrap.min.js>< / script>
解决方案
您是否包含此脚本:
< script language =JavaScripttype =text / javascript>
$(document).ready(function(){
$('。carousel')。carousel({
interval:2000
})
});
< / script>
编辑
<即使它不起作用,请在调用jquery之前检查是否调用了上述脚本。所以,它应该是这样的:
<! - 首先调用jquery - >
< script language =JavaScripttype =text / javascriptsrc =scripts / jquery.js>< / script>
< script language =JavaScripttype =text / javascriptsrc =scripts / bootstrap.min.js>< / script>
<! - Carousel - >
< script language =JavaScripttype =text / javascript>
$(document).ready(function(){
$('。carousel')。carousel({
interval:3000
})
});
< / script>
I have been trying to use the Bootstrap Carousel and have been successful to some extent. I can click and change the images too. But I have got one problem. Its just not sliding! Where am I doing wrong?
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>
EDIT:
jquery:
<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>
解决方案
Did you include this script:
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$('.carousel').carousel({
interval: 2000
})
});
</script>
Edit
And even it its not working, please check whether you are calling the above script before calling the jquery. So, it should be like this:
<!-- 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>
这篇关于Bootstrap传送带不能滑动的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文