Chosen: ホイールスクロールは、FireFoxでjquery-mousewheelプラグインと組み合わせて遅くなります

作成日 2017年06月01日  ·  5コメント  ·  ソース: harvesthq/chosen

jquery-mousewheelプラグインと組み合わせて使用​​すると再現されます。

https://jsfiddle.net/4Lba076o/を参照してください

ChromeではスクロールはOKです。
Firefoxでは非常に遅い(1px)。

基本的に、マウスホイールの動作はevent.deltaFactorを利用していません(ただし、これは非標準です)。
Firefoxでは、jquery-mousewheelはイベントを{deltaY:-42}から{deltaY:-1、deltaFactor:42}に変換します

最も参考になるコメント

私も同じ問題を抱えていましたが、それはマウスホイールとは何の関係もないと思います。

Firefoxは1行あたりのスクロールであるdeltaMode1を使用していることがわかりました。 したがって、デルタ3は、ピクセルではなく3本の線を意味します。

私はこれをchosen.jquery.jsにハッキングし、スクロールを大幅に高速化しました。

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());
      }
    };

全てのコメント5件

私も同じ問題を抱えていましたが、それはマウスホイールとは何の関係もないと思います。

Firefoxは1行あたりのスクロールであるdeltaMode1を使用していることがわかりました。 したがって、デルタ3は、ピクセルではなく3本の線を意味します。

私はこれをchosen.jquery.jsにハッキングし、スクロールを大幅に高速化しました。

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());
      }
    };

stormanによって提案されたパッチは私たちにとって完璧に機能します。 将来のリリースで公開される予定ですか?

@storemanは、パッチを使用してプルリクエストを開くことができますか?

私はcoffeescriptやそれをgruntでコンパイル/テストする方法を知りません。 うまくいくと思う修正を加えましたが、テストできないので、プルリクエストを作成したくありません。 私のcoffeescriptの修正はここにあります:
https://github.com/tioga-tours/chosen/tree/faster-firefox-scroll

@storeman
実際には、jquery mousewheelに直接接続しています。これは、両方のプラグインがある場合、jquerymousewheelが前述のようにマウスイベントを変換するためです。 jqueryがなければ、マウスホイールのスクロール動作はFFでは問題ありません。

それで、両方のプラグインのソースコードを変更せずにそれをどのように修正したか-私は登録するたびに$(..)。unmousewheel()を実行します.chosen(); そのための簡単なプラグインを書くことができます:)

あなたがここでした方法でそれを修正するなら
factor = evt.originalEvent.deltaMode === 1 /** DOM_DELTA_LINE */ ? 16 : 1;
それから私はそれをに変更します
factor = evt.originalEvent.deltaFactor || 1;

このページは役に立ちましたか?
0 / 5 - 0 評価