javascript - quantum - el evento mousewheel no se está activando en el navegador Firefox

create event javascript

Question

Por favor, consulte el siguiente código.

$(this.element).on("mousewheel", this.chartMouseWheel);

chartMouseWheel:function(e) {
        if(e.originalEvent.wheelDelta /120 > 0) {
            alert(''scrolling up !'');
        }
        else{
          alert(''scrolling down !'');
        }

        if (e.preventDefault)
        e.preventDefault();
        e.returnValue = false;
    },

¿Este evento se activa correctamente en IE, Chrome y no se activa en Firefox?

Answer 1

Badri tiene razón, debes usar "DOMMouseScroll" en lugar de Firefox. Además de esto, para delta necesita usar event.originalEvent.detail en lugar de event.originalEvent.wheelDelta. Para abajo, event.originalEvent.detail da un valor positivo mientras que event.originalEvent.wheelDelta da un valor negativo y viceversa.

 $(stage.content).on(''mousewheel DOMMouseScroll'', zoomHelper.zoom);   

 if (navigator.userAgent.toLowerCase().indexOf(''firefox'') > -1) {
            if (event.originalEvent.detail > 0) {
                //scroll down
                delta = 0.2;
            } else {
                //scroll up
                delta = 0;
            }
        } else {
            if (event.originalEvent.wheelDelta < 0) {
                //scroll down
                delta = 0.2;
            } else {
                //scroll up
                delta = 0;
            }
        }

JSFiddle (funciona en IE 11, Firefox 33 y Chrome 38, no probé otros navegadores): http://jsfiddle.net/rpaul/ckwu7u86/3/

Answer 2

Esto es 2017 y la respuesta correcta es ahora:

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

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

Funciona con la actual Firefox 51, Chrome 56, IE9 +

Nota: El valor de los deltas dependerá del navegador y la configuración del usuario.

Answer 3

Esto parece funcionar en Safari, Chrome y Firefox (no lo he probado en IE):

// For Chrome
window.addEventListener(''mousewheel'', mouseWheelEvent);

// For Firefox
window.addEventListener(''DOMMouseScroll'', mouseWheelEvent);

function mouseWheelEvent(e) {
  var delta = e.wheelDelta ? e.wheelDelta : -e.detail;
  console.log(delta);
}

De: http://www.h3xed.com/programming/javascript-mouse-scroll-wheel-events-in-firefox-and-chrome

Answer 4

Firefox no reconoce "mousewheel" a partir de la versión 3. Debería usar "DOMMouseScroll" en lugar de firefox.

compruebe esto: http://www.javascriptkit.com/javatutors/onmousewheel.shtml

Answer 5

O simplemente use el plugin jQuery de jquery-mousewheel .

Answer 6

Utilizar wheel evento. Esta página también proporciona polyfills para navegadores antiguos https://developer.mozilla.org/en-US/docs/Web/Events/wheel