jQueryのscrollTop()
は要素やウィンドウの現在のスクロール位置を取得したり、更に強制的に指定のスクロール位置までスクロールさせるといった処理も可能な2つの機能を有するメソッドです。
セレクタで指定した要素の現在のスクロール位置(垂直方向)のピクセルの値を取得します。
// div要素のスクロール位置
$('div').scrollTop()
// ウィンドウのスクロール位置
$(window).scrollTop()
Integer
スクロール位置が整数で返されます。
引数で指定した位置にスクロール(垂直方向)を行うメソッドです。
value
設定するスクロール位置
// div要素内(overflow: scrollの場合など)
$('div').scrollTop(100)
// ウィンドウ全体
$(window).scrollTop(100)
jQueryオブジェクト
上記のサンプルコードではスクロール時のイベントハンドラの中で.scrollTop()
によって、現在の垂直方向のスクロール幅を取得し、表示させています。
またスクロール幅が500pxを超えた場合にアラートを表示する仕組みを入れています。
上記のサンプルコードではボタンをクリックした際に、.scrollTop(value)
により200pxや800pxなど指定のスクロール幅になるように垂直方向にスクロールさせています。