我尝试过不同的方法为图片carouse设置水平滚动,最后还是这样,但遗憾的是我无法弄清楚如何使用 Flickity 来解决以下问题图像滑块。浏览器控制台显示以下错误:
无法设置属性' x'未定义的 无法阅读财产' x'未定义的
这些行为非常糟糕,你可以在 example of codepen.io
中看到$('.gallery').mousewheel(function(e) {
e.preventDefault();
var flkty = Flickity.data(this);
if (!window.wheeling) {
// console.log('start wheeling!');
if(e.deltaX > 0 || e.deltaY < 0){
flkty.next();
} else if(e.deltaX < 0 || e.deltaY > 0){
flkty.previous();
}
}
clearTimeout(window.wheeling);
window.wheeling = setTimeout(function() {
// console.log('stop wheeling!');
delete window.wheeling;
// reset wheeldelta
window.wheeldelta.x = 0;
window.wheeldelta.y = 0;
}, 50);
window.wheeldelta.x += e.deltaFactor * e.deltaX;
window.wheeldelta.y += e.deltaFactor * e.deltaY;
if(window.wheeldelta.x > 500 || window.wheeldelta.y > 500 || window.wheeldelta.x < -500 || window.wheeldelta.y < -500){
window.wheeldelta.x = 0;
window.wheeldelta.y = 0;
if(e.deltaX > 0 || e.deltaY < 0){
flkty.next();
} else if(e.deltaX < 0 || e.deltaY > 0){
flkty.previous();
}
}
// console.log(window.wheeldelta);
});
P.S:代码在 this JQuery plugin 之上。
答案 0 :(得分:0)
我不记得在浏览器中全局范围内存在像wheeldelta这样的现有属性,而且从你的样本中看来,wheeldelta似乎都是通过你的代码直接计算和使用的。
在这种情况下,只需在开始时启动wheeldelta即可解决您的问题:
window.wheeldelta = {}