gpt4 book ai didi

javascript - Owl Carousel 不会自动播放

转载 作者:塔克拉玛干 更新时间:2023-11-02 22:02:35 27 4
gpt4 key购买 nike

我正在使用 Owl Carousel 2 构建一个带有 JQuery 轮播的 wordpress 网站JQuery 插件。我以前成功使用过这个旋转木马,但我对这个感到困惑,我需要你的帮助。我希望其他可能遇到同样问题的人可以引用这个你们都帮助过的解决方案。

轮播将加载,图像正在显示,我尝试过的大多数选项都有效,但自动播放不会在 5 秒后加载下一张图像。正如使用 Firebug 网络检查器验证的那样,所有文件都在正确的位置并正确加载。 提前感谢您的帮助/建议!

自定义js:

    $(document).ready(function(){
var owl = $(".owl-carousel");
owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true
});
});

HTML:

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>
<script src="owl/js/owl.carousel.min.js"></script>
<script type="text/javascript" src="customjs.js"></script>
</head>
<body>
<div id="feature" class="full">
<!-- FEATURE ROTATOR -->
<div id="home-feature" class="owl-carousel owl-theme">
<div class="item">
<a href="#">
<img src="/images/home/rotator1.jpg"
alt="Feature 1"/>
</a>
</div>
<div class="item">
<a href="#">
<img src="/images/home/rotator2.jpg"
alt="Feature 2"/>
</a>
</div>
<div class="item">
<a href="#">
<img src="/images/home/rotator3.jpg"
alt="Feature 3"/>
</a>
</div>
<div class="item">
<a href="#">
<img src="/images/home/rotator4.jpg"
alt="Feature 4"/>
</a>
</div>
</div>
</div>
</body>

我还尝试根据 this stackoverflow thread 上的建议在 document.ready 函数中附加 owl.trigger('owl.play',6000);无济于事。

最佳答案

想通了。哇,真不敢相信我错过了。必须在部分中包含 autoplay.js

<script src="owl/js/owl.autoplay.js"></script>

关于javascript - Owl Carousel 不会自动播放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26351046/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com