(添加鼠标滚轮功能)使用DOMmouseScroll和鼠标滚轮来调用功能

时间:2014-04-21 19:12:27

标签: javascript jquery html mouseevent mousewheel

我正在尝试创建一个在鼠标滚轮向不同方向移动时调用其他功能的功能。我不知道如何实现这个

我最初设置代码以便能够使用mousewheel事件,但Firefox不支持mouswheel事件。所以我需要一种方法来使用DOMmouseScroll。如果有人能够像我已经设置的那样设置它。

注意:我要求使用DOMmouseScroll和mousewheel,所以我建议添加到我的代码中,但如果不能这样做,那就没关系了......

以下是我设置代码的方式:

$( '#container' ).on( 'mousewheel', function ( event ) {

    // crude check to see events are supported
    if ( typeof event.originalEvent.wheelDeltaX === 'undefined'
        || typeof event.originalEvent.wheelDeltaY === 'undefined' ) {
        console.log( "could not find mouse deltas" );
        return;
    }

    var deltaX = event.originalEvent.wheelDeltaX;
    var deltaY = event.originalEvent.wheelDeltaY;

    var scrolledLeft = deltaX < 0;
    var scrolledRight = deltaX > 0;
    var scrolledUp = deltaY < 0;
    var scrolledDown = deltaY > 0;

    if ( scrolledLeft ) { someFunction }
    if ( scrolledRight ) { someOtherFunction }
    if ( scrolledUp ) { anotherFunction }
    if ( scrolledDown ) { andAnotherFunction }
});

1 个答案:

答案 0 :(得分:1)

我建议使用跨浏览器兼容的wheel事件重新实现此操作。 mousescroll和DOMmousescroll已被弃用,以支持现代浏览器中的这一新事件。请阅读该页面上的所有文档以获取详细信息,以及跨浏览器兼容的addWheelListener函数的示例实现。