mousewheel event not working on firefox

Question

Below code is working fine on chrome however it doesn't work on Mozilla for some reason that I am not aware yet. Am i missing something ?

$(window).bind('mousewheel', function(event) {
    if (event.originalEvent.wheelDelta >= 0) {
        $('#currentMove').html('Movement: Scroll up');
        $('#currentMove').css('background','#98FB98');
        scrollUp++;
        $('#scrollUp').html(scrollUp);

    }
    else {
        $('#currentMove').html('Movement: Scroll down');
        $('#currentMove').css('background','#FFB6C1');
        scrollDown++;
        $('#scrollDown').html(scrollDown);
    }
});

Here is my fiddle: https://jsfiddle.net/w0wffbxc/ Appreciate your help with this.

Possible duplicate of https://stackoverflow.com/questions/16788995/mousewheel-event-is-not-triggering-in-firefox-browser — moon, Nov 29 '17 at 09:15
Possible duplicate of [mousewheel event is not triggering in firefox browser](https://stackoverflow.com/questions/16788995/mousewheel-event-is-not-triggering-in-firefox-browser) — moon, Nov 29 '17 at 09:16

score 7 · Accepted Answer · answered Nov 29 '17 at 09:16

7

Here's your sqlfiddle fixed.

You should use wheel as mousewheel is not recognized by Firefox since version 3. Also with wheel, you should use event.originalEvent.deltaY instead.

answered Nov 29 '17 at 09:16

Steve Chamaillard

2,289
17
32

score 3 · Answer 2 · answered Nov 29 '17 at 09:14

Use wheel event instead. Its more of a standard now. This page also provides polyfills for old browsers https://developer.mozilla.org/en-US/docs/Web/Events/wheel

Ex

$(window).on('wheel', function(event){

    // deltaY obviously records vertical scroll, deltaX and deltaZ exist too
    if(event.originalEvent.deltaY < 0){
        // wheeled up
        console.log("Works Up");
    }
    else {
        // wheeled down
        console.log("Works Down");
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

mousewheel event not working on firefox

2 Answers2