[英]Owl carousel autoplay only plays once when using the autoplay trigger on mouseenter
I am trying to only start autoplay when a user sees the carousel (else newest posts won't be visible by the time the user scrolls to the carousel element) using this code: 我试图仅使用以下代码在用户看到轮播时开始自动播放(当用户滚动到轮播元素时,其他最新帖子将不可见):
var App = (function(window){
"use strict";
var _this = null;
var cacheCollection = {};
return{
init : function(){
_this = this;
this.autoplayonsection();
},
autoplayonsection: function(){
var fbowl = $('#r-latest-news-slider');
$('#r-latest-news').on('mouseenter', function() {
console.log('autoplay');
fbowl.trigger('play.owl.autoplay', [1000]);
});
$('#r-latest-news').on('mouseleave', function() {
console.log('stop autoplay');
fbowl.trigger('stop.owl.autoplay');
});
},
LatestNewsCarousel: function(){
if($("#r-latest-news-slider").length > 0){
var owl = $('#r-latest-news-slider').owlCarousel({
loop:true,
margin: 30,
items: 4,
nav: false,
dots: true,
autoplay:false,
autoplayTimeout:1000,
responsive:{
0:{
items:2
},
600:{
items:2
},
1000:{
items:4
}
}
})
}
},
}
})(window);
$(document).ready(function($) {
$('#preloader').fadeOut('slow',function(){$(this).remove();});
App.init();
});
The console log works fine and I see the texts when I move my mouse over the element or leave it. 控制台日志运行良好,当我将鼠标移到元素上或将其放在上面时,我会看到文本。 But for some reason the autoplay only works once, it slides once and then stops until I leave with my mouse en re enter the element at which time it plays once again. 但是由于某种原因,自动播放只能运行一次,它会滑动一次然后停止,直到我用鼠标离开并重新输入该元素时,它才会再次播放。
This is the element that contains my carousel: 这是包含我的轮播的元素:
<div class="owl-carousel r-latest-news-list" id="r-latest-news-slider">
Why does it only play once? 为什么只播放一次? What can I do to fix it? 我该如何解决?
I found out that the minimum value for autoplayTimeout
is 1233
...below than 1233
will not working... 我发现autoplayTimeout
的最小值是1233
...低于1233
将不起作用...
below is the example of working options: 以下是工作选项的示例:
{
items:1,
loop:true,
smartSpeed:1200,
autoplay:true,
autoplayTimeout:1500, //if you set this value to 1000, it will NOT working
autoplayHoverPause:true,
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.