Jquery动画水平滚动鼠标滚动事件



我一直在做这个动画水平偏移的div,在mousescroll事件。这是我到目前为止所做的链接,有人能看出我做错了什么吗?

动画发生在点击动作,我需要相同的鼠标滚动。http://jsfiddle.net/laksdesign/WvRR6/

jQuery(document).ready(function($) {
    $(".scroll").click(function(event) {
        event.preventDefault();
        $('#wrapper').animate({ scrollLeft: $('#wrapper').scrollLeft() + $(this.hash).offset().left }, 800);
    });
    $('body').bind('mousewheel', function(scroll){
        if(scroll.originalEvent.wheelDelta /120 > 0) {
            scroll.preventDefault();
            $('#wrapper').animate({ scrollLeft: $('#wrapper').scrollLeft() + $(this.hash).offset().left }, 800);
        } else{
        }
    });
});

还有另一个参考,我采取的动画基于鼠标滚动是:http://jsfiddle.net/laksdesign/EATaU/

为了在jQuery中捕获mousescroll事件,您需要使用插件或一些外部函数。我建议使用插件而不是重新发明轮子。请注意,在参考中,您提供的小提琴是如何使用mousewheel.js文件的-这是您需要使用的插件。

关于如何使用

插件的更多信息,请参阅这个答案。

可以使用的插件示例:

  • BrandonAaron.com -我不允许链接到这个网站,所以谷歌代替。

你可以这样使用插件:

// using bind
$('#my_elem').bind('mousewheel', function(event, delta) {
    console.log(delta);
});

正如用户@Dom在上面的评论中建议的那样,另一个广泛使用的插件是:

    jQuery Mousewheel

最新更新