【发布时间】:2016-11-28 23:14:12
【问题描述】:
我使用了一个演示 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();
});
【问题讨论】:
-
要了解我想要什么 - 尝试将窗口大小调整为最小尺寸(每个阶段一张幻灯片)并尝试用鼠标滚轮滚动猫头鹰轮播 owlcarousel2.github.io/OwlCarousel2/demos/mousewheel.html 你不能滚动 1 幻灯片或 2 - 它一次滚动 7-11 张幻灯片,它不会在幻灯片 2 或 3 上停止。
标签: jquery scroll owl-carousel mousewheel owl-carousel-2