Chosen: A rolagem da roda é lenta no FireFox em conjunto com o plugin jquery-mousewheel

Criado em 1 jun. 2017  ·  5Comentários  ·  Fonte: harvesthq/chosen

É reproduzido ao usar em conjunto com o plugin jquery-mousewheel.

Veja https://jsfiddle.net/4Lba076o/

No Chrome, a rolagem está OK.
No Firefox é muito lento (1px).

Basicamente, o comportamento da roda do mouse não está utilizando event.deltaFactor (que no entanto não é padrão).
No Firefox jquery-mousewheel transforma o evento de {deltaY: -42} para {deltaY: -1, deltaFactor: 42}

Comentários muito úteis

Eu tive o mesmo problema, mas não tem nada a ver com a roda do mouse, eu acho.

Descobri que o Firefox usa um deltaMode de 1, que é rolagem por linha. Portanto, um delta de 3 significa 3 linhas em vez de pixels.

Eu invadi isso no choose.jquery.js e tornou a rolagem muito mais rápida:

Chosen.prototype.search_results_mousewheel = function(evt) {
     /** Added the factor var and set it's value to 16 when scrolling is line scrolling */
      var delta, factor;
      if (evt.originalEvent) {
        factor = evt.originalEvent.deltaMode === 1 /** DOM_DELTA_LINE */ ? 16 : 1;
        delta = factor * evt.originalEvent.deltaY || -evt.originalEvent.wheelDelta || evt.originalEvent.detail;
      }

      if (delta != null) {
        evt.preventDefault();
        if (evt.type === 'DOMMouseScroll') {
          delta = delta * 40;
        }
        return this.search_results.scrollTop(delta + this.search_results.scrollTop());
      }
    };

Todos 5 comentários

Eu tive o mesmo problema, mas não tem nada a ver com a roda do mouse, eu acho.

Descobri que o Firefox usa um deltaMode de 1, que é rolagem por linha. Portanto, um delta de 3 significa 3 linhas em vez de pixels.

Eu invadi isso no choose.jquery.js e tornou a rolagem muito mais rápida:

Chosen.prototype.search_results_mousewheel = function(evt) {
     /** Added the factor var and set it's value to 16 when scrolling is line scrolling */
      var delta, factor;
      if (evt.originalEvent) {
        factor = evt.originalEvent.deltaMode === 1 /** DOM_DELTA_LINE */ ? 16 : 1;
        delta = factor * evt.originalEvent.deltaY || -evt.originalEvent.wheelDelta || evt.originalEvent.detail;
      }

      if (delta != null) {
        evt.preventDefault();
        if (evt.type === 'DOMMouseScroll') {
          delta = delta * 40;
        }
        return this.search_results.scrollTop(delta + this.search_results.scrollTop());
      }
    };

Patch proposto por storman funciona perfeitamente para nós. Está planejado para ser publicado em uma versão futura?

@storeman você pode abrir um pull request com seu patch?

Eu não sei coffeescript ou como compilar/testar com grunt. Fiz uma correção que acho que deve funcionar, mas não consigo testar, então não quero criar uma solicitação pull. Minha correção no coffeescript pode ser encontrada aqui:
https://github.com/tioga-tours/chosen/tree/faster-firefox-scroll

@storeman
Na verdade ele tem conexão direta com o jquery mousewheel, pois se você tiver os dois plugins, o jquery mousewheel transforma os eventos do mouse como mencionei. Sem o comportamento de rolagem da roda do mouse jquery está bem no FF.

Então, como eu consertei isso sem modificar o código-fonte de ambos os plugins - eu apenas faço $(..).unmousewheel() em lugares para cada registro .chosen(); Pode-se escrever um plugin simples para isso :)

Se consertando isso da maneira que você fez aqui
factor = evt.originalEvent.deltaMode === 1 /** DOM_DELTA_LINE */ ? 16 : 1;
então eu mudaria para
factor = evt.originalEvent.deltaFactor || 1;

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

Jeckerson picture Jeckerson  ·  7Comentários

eduardokranz picture eduardokranz  ·  6Comentários

gandarez picture gandarez  ·  5Comentários

alexfrancavilla picture alexfrancavilla  ·  9Comentários

ali1360 picture ali1360  ·  5Comentários