1

スクロールパネルの上に絶対位置のキャンバス要素があるようにアプリ/ウェブサイトをセットアップしました。スクロールパネルがスクロールするときに、キャンバスにオフセットを適用して、画像がスクロールしているように見せます巨大なキャンバス要素のオーバーヘッドのない巨大なキャンバス)。問題は、マウスがキャンバス要素の上にあるときに、スクロール イベントがバブリングしないため、スクロール ホイールが機能しないことです。ただし、この場合、スクロールバーを機能させるにはバブリングが必要です。

私はこれにGWTを使用しているので、2つを混在させるのはちょっと難しいので、jQueryソリューションに依存しないことをお勧めします(純粋なjavascriptソリューションは問題ありません)。マウスホイール イベントをキャプチャできますが、その主な問題は、スクロール (上下) とホイールの傾斜 (左右) を区別していないように見えることです。eventGetShiftKey()、eventGetButton()、eventGetType() などを試しましたが、これらのメソッドはすべて、スクロールとチルトに対してまったく同じ結果を返します (左に傾ける = 上にスクロール、右に傾ける = 下にスクロール)。

これを処理する最良の方法は、実際のイベントをスクロールパネルにバブルすることです (ちなみに、絶対位置のキャンバスを含む親 div も含まれています) が、それが可能かどうかはわかりません。

4

1 に答える 1

6

マウスホイール イベントはバブリングします。上下のスクロールを区別するには、event.wheelDeltaevent.detail属性を使用します。

event.wheelDelta は、ホイール ボタンが回転した距離を示し、120 の倍数で表されます。正の値は、ホイール ボタンがユーザーから離れて回転したことを示します。負の値は、ホイール ボタンがユーザーに向かって回転したことを示します。

event.detail は、マウス ホイールが移動した「ティック」数を指定します。正の値は「下/右」、負の上/左を意味します
。event.axis はスクロール ジェスチャの軸 (水平または垂直) を指定します。この属性は Firefox 3.5 で追加されました。

また、正規化について少し説明しているこの記事も参照してください。

于 2011-06-01T00:41:53.313 に答える