设置OwlCarousel2的滚动速度

时间:2016-11-28 15:09:23

标签: jquery scroll owl-carousel mousewheel owl-carousel-2

我用了一个演示 https://owlcarousel2.github.io/OwlCarousel2/demos/mousewheel.html 只更改了下面的代码,因为它在该样本中进行了反向滚动。

if (e.deltaY>0) {
owl.trigger('prev.owl');
} else {
owl.trigger('next.owl');
}

但它以非常快的速度滚动它。 如果你每个阶段使用6个项目 - 没关系,但是如果你每个阶段使用2个或1个项目 - 它会滚动到数字10-11,而不是项目编号3或4。

如何让滚动速度变慢?要在一个卷轴上滚动2-3个项目吗?

我使用Safari,Mac OSX Sierra

完整的JS代码:

var owl = jQuery('.owl-carousel');
owl.owlCarousel({
loop:false,
// stagePadding: 100,
slideBy:1,
nav:true,
margin:0,
responsiveClass:true,
responsive:{
0:{items:1},
600:{items:2,slideBy:2},
1024:{items:2,slideBy:2},
1366:{items:3,slideBy:3},
1920:{items:4,slideBy:4}
}
});

jQuery(".owl-prev").html('');
jQuery(".owl-next").html('');

owl.on('mousewheel', '.owl-stage', function (e) {
if (e.deltaY>0) {
owl.trigger('prev.owl.carousel', [1000]);
} else {
owl.trigger('next.owl.carousel', [1000]);
}
e.preventDefault();
});

1 个答案:

答案 0 :(得分:0)

我认为,你必须把prev.owl.carousel放在例如:

    owl.on('mousewheel', '.owl-stage', function (e) {
     if (e.deltaY>0) {
      owl.trigger('prev.owl.carousel', [5000]);
     } else {
      owl.trigger('next.owl.carousel', [5000]);
    }

e.preventDefault(); });