试图将 jquery-mousewheel 插件插入到 jquery cycle2

Question

我正在尝试将 jquery-mousewheel 插件 (https://github.com/jquery/jquery-mousewheel) 与插件 - jquery cycle2 插件集成。

一切都很好，直到我发现鼠标滚动会触发很多滚动事件，尤其是新的“魔术”触控板和鼠标，它们会在滚轮中产生很大的惯性。

在 GitHub 上我找到了一个专门为这个插件设计的插件 (https://github.com/amondit/jquery.scrollsteps.js) 来解决这个问题。

我使用了 jquery.scrollsteps-full-min.js 文件。

这就是我对插件的称呼：

$(function() {

    var $slider = $('.slider_overlay');

    // slider initialize
    $slider.cycle({
        fx: 'scrollVert',
        timeout: 0,
        pager: '.slider_list',
        pagerTemplate: '',
        pagerActiveClass: 'active_slide',
        slides: '> div',
        centerHorz: true,
        centerVert: true,
        speed: 1000
    });

    // initialize scrollsteps plugin
    $slider.scrollsteps({
        up: $slider.cycle('prev'),
        down: $slider.cycle('next')
    });

});

而且，当我开始上下滚动页面时，我从 firebug 控制台收到以下错误消息：

“TypeError：i.dow​​n 不是函数”或“TypeError：i.up 不是函数”

也许有人对为什么会发生此错误有任何想法或想法？

如果我使用默认的鼠标滚轮初始化（没有滚动步骤插件） - 一切正常：

$slider.mousewheel(function(e) {
    if (e.deltaY > 0) {
        $slider.cycle('prev');
    } else {
        $slider.cycle('next');
    }
});

但正如我提到的，它会触发很多滚动事件。

也许我没有正确解决这个问题？如果有人知道其他解决方案 - 将非常感谢您的帮助。

Answer 1

回答）

$(function() {

    var $slider = $('.slider_overlay');

    $slider.cycle({
        fx: 'scrollVert',
        timeout: 0,
        pager: '.slider_list'
        pagerTemplate: '',
        pagerActiveClass: 'active_slide',
        slides: '> div',
        centerHorz: true,
        centerVert: true,
        speed: 1000
    });

    function prev() {
        $slider.cycle('prev')
    }

    function next() {
        $slider.cycle('next')
    }

    $slider.scrollsteps({
        up: prev,
        down: next
    });

});