猫头鹰旋转木马不自动播放

Owl Carousel does not Autoplay

本文关键字:自动播放 旋转木马 猫头鹰      更新时间:2023-09-26

我在我的网站使用Owl Carousel

,它不会自动播放这是网站的链接网站链接

这是HTML代码

<script src="owl-carousel/owl.carousel.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#owl-demo").owlCarousel({
	autoplay : 5000,
	navigation : false, // Show next and prev buttons
	slideSpeed : 300,
	paginationSpeed : 400,
	singleItem:true
});
$("#owl-demo2").owlCarousel({
autoplay : 5000,
	navigation : false, // Show next and prev buttons
	slideSpeed : 300,
	paginationSpeed : 400,
	singleItem:true
});
$("#owl-demo3").owlCarousel({
autoplay : 5000,
	navigation : false, // Show next and prev buttons
	slideSpeed : 300,
	paginationSpeed : 400,
	singleItem:true
});
});
</script>
<div id="owl-demo2" class="owl-carousel owl-theme">
					<div class="item">
							<img src="img/k1.jpg" class="img-responsive center-block" alt="" />
							<div class="capt text-center">
								قرية بوذيب
							</div>
					</div>
					<div class="item">
							<img src="img/k1.jpg" class="img-responsive center-block" alt="" />
							<div class="capt text-center">
								قرية بوذيب
							</div>
					</div>
					<div class="item">
							<img src="img/k1.jpg" class="img-responsive center-block" alt="" />
							<div class="capt text-center">
								قرية بوذيب
							</div>
					</div>
				</div>
			</div>
请随时查看链接,看看是否可以发现任何问题。感谢所有的帮助!这里是指向自己的Carousel文档的链接http://owlgraphic.com/owlcarousel/#how-to谢谢你的帮助

在这个例子中,你有autoplay : 5000,但在你的网站中你没有。

在你的网站上更新这段代码来解决这个问题:

$("#owl-demo").owlCarousel({
    autoplay : 5000,
    navigation : false, // Show next and prev buttons
    slideSpeed : 300,
    paginationSpeed : 400,
    singleItem:true
});
$("#owl-demo2").owlCarousel({
    autoplay : 5000,
    navigation : false, // Show next and prev buttons
    slideSpeed : 300,
    paginationSpeed : 400,
    singleItem:true
});
$("#owl-demo3").owlCarousel({
    autoplay : 5000,
    navigation : false, // Show next and prev buttons
    slideSpeed : 300,
    paginationSpeed : 400,
    singleItem:true
});