同步 2 owl 个轮播或添加回调,例如 "onchangeprev, onchangenext"
Sync 2 owl carousels or add callbacks like "onchangeprev, onchangenext"
我正在尝试同步 2 个 owl 轮播,以便它们同时以相同方式更改幻灯片。旋转木马是循环的。
当我使用这个时:
$("#slider").on('change.owl.carousel', function(event) {
$("#text_slider").trigger('to.owl.carousel', [event.item.index,0,true]);
})
到达项目末尾后的第二个旋转木马没有像它应该的那样向前移动(它是循环的)而是向后移动到第一个项目。
我也禁用了拖动并尝试了这个:
$('#slider .owl-prev').click(function() {
$("#text_slider").trigger('prev.owl.carousel');
})
$('#slider .owl-next').click(function() {
$("#text_slider").trigger('next.owl.carousel');
})
第一次看起来还不错...但是自动播放也已启用,并且在两个轮播上都是一样的(autoplay:true, autoplayTimeout:4000, smartSpeed:400
),如果观看轮播一两分钟,我会注意到时间间隔发生在更换幻灯片,他们开始异步移动。间隔不大,不到1秒,但真的很不想要:(
如果我可以在将项目更改为上一个时调用触发器 prev.owl.carousel
并在将项目更改为下一个时调用 next.owl.carousel
并在第二轮播中禁用自动播放,但我没有找到方法,那就太好了去做:(
欢迎提出任何关于使用另一个响应迅速且可以循环和同步的滑块插件的建议
owl轮播似乎没有解决方法。我发现 flexslider 可以用于此,它有同步选项并且工作正常。
我正在尝试同步 2 个 owl 轮播,以便它们同时以相同方式更改幻灯片。旋转木马是循环的。 当我使用这个时:
$("#slider").on('change.owl.carousel', function(event) {
$("#text_slider").trigger('to.owl.carousel', [event.item.index,0,true]);
})
到达项目末尾后的第二个旋转木马没有像它应该的那样向前移动(它是循环的)而是向后移动到第一个项目。
我也禁用了拖动并尝试了这个:
$('#slider .owl-prev').click(function() {
$("#text_slider").trigger('prev.owl.carousel');
})
$('#slider .owl-next').click(function() {
$("#text_slider").trigger('next.owl.carousel');
})
第一次看起来还不错...但是自动播放也已启用,并且在两个轮播上都是一样的(autoplay:true, autoplayTimeout:4000, smartSpeed:400
),如果观看轮播一两分钟,我会注意到时间间隔发生在更换幻灯片,他们开始异步移动。间隔不大,不到1秒,但真的很不想要:(
如果我可以在将项目更改为上一个时调用触发器 prev.owl.carousel
并在将项目更改为下一个时调用 next.owl.carousel
并在第二轮播中禁用自动播放,但我没有找到方法,那就太好了去做:(
欢迎提出任何关于使用另一个响应迅速且可以循环和同步的滑块插件的建议
owl轮播似乎没有解决方法。我发现 flexslider 可以用于此,它有同步选项并且工作正常。