WheelEvent deltaY属性

DOM イベント WheelEvent

定義と使用法

deltaY属性は下にスクロールした場合に正の値を、上にスクロールした場合に負の値を、それ以外の場合は0を返します。

注記：この属性は読み取り専用です。

例

例1

ユーザーが上にスクロールしたか下にスクロールしたかを返します：

function myFunction(event) {
  var y = event.deltaY;
}

自分で試してみてください

例2

DIV内をスクロールして大きく/小さくします：

function myFunction(event) {
  var y = event.deltaY;
  var currentSize = event.target.style.width;
  if (y > 0) {
    newSize = parseInt(currentSize) + 10;
  } else {
    newSize = parseInt(currentSize) - 10;
  }
  event.target.style.width = newSize + "px";
  event.target.style.height = newSize + "px";
}

自分で試してみてください

文法

event.deltaY

技術的詳細

戻り値： Double 型の値、マウスローラーのスクロール方向を示します。

ブラウザサポート

属性 Chrome IE Firefox Safari Opera
deltaY 31 サポート 17 サポートしていない 18

関連ページ

HTML DOM リファレンスマニュアル：WheelEvent deltaX 属性

DOM イベント WheelEvent