猫头鹰旋转木马不会自动播放
我正在使用Owl Carousel 2 JQuery插件构建一个带有JQuery轮播的wordpress网站。 我之前已经成功使用过这个旋转木马,但是我很难过这个,我需要你的帮助。 我希望其他可能遇到同样问题的人可以参考这个你帮忙的解决方案。
旋转木马将加载,图像正在显示,我尝试过的大多数选项都在工作,但自动播放不会在5秒后加载下一张图像。 正如使用Firebug网络检查器validation的那样,所有文件都在正确的位置并正确加载。 感谢您的帮助/建议!
customjs.js:
$(document).ready(function(){ var owl = $(".owl-carousel"); owl.owlCarousel({ items: 1, autoplay: true, autoplayTimeout: 5000, autoplayHoverPause: true }); });
HTML:
我也试过追加owl.trigger('owl.play',6000);
在document.ready函数内根据这个stackoverflow线程的建议无济于事。
弄清楚了。 哇,简直不敢相信我错过了。 必须在该部分中包含autoplay.js
我也遇到过类似的问题。 然后我搜索并找到了一个解决方案, autoplay
应该重新校正为autoPlay
,p为大写。 它对我有用。
如果您从Github( OwlCarousel2 src文件夹 )下载它,您将获得单独的文件,您需要在HTML中单独指定owl.autoplay.js和owl.carousel.js 。
如果从Owl Carousel的网站下载, owl.autoplay.js将包含在owl.carousel.js文件中。
这是愚蠢的解决方案,但也许有人可以面对它。
我曾在其他代码中工作过,所以他在一个包含的javascript文件中用“autoPlay:false”调用owlCarousel()。 我用“autoPlay:true”调用owlCarousel()函数后调用它。 但它不起作用,如果它调用两次相同的function,浏览器也不会在控制台上发出任何通知。
owl.owlCarousel({ items:4, nav:true, loop:true, autoWidth:true, itemsTablet: [768,1] });
-
首先,您需要调用owl.autoplay.js。
-
这段代码适合我:
owl.trigger('play.owl.autoplay',[1000]);
当您调用需要添加的owl-demo / owl-carousel时,您需要这样做
| autoPlay:3000 | (—– 3000 =图像之间3秒旋转。
你不需要碰任何其他东西。
$(document).ready(function() { var owl = $("#owl-demo"); owl.owlCarousel({ navigation : false, singleItem : true, autoPlay: 3000, transitionStyle : "fadeUp" }); });