scroll()、scrollBy()、scrollTo() メソッド
Window.scroll()
、Window.scrollBy()
、Window.scrollTo()
scroll()、scrollBy()、scrollTo() メソッドは、 指定されたページの位置にスクロールをして移動します。
これらのメソッドはスクロール可能なページでなければスクロールはしません。
scroll()、scrollTo() メソッドは、web ページの全体の左上端が基準になります。絶対位置による指定と呼ばれます。
scrollBy() メソッドは相対位置による指定で現在位置が基準になります。
Window オブジェクトの指定には、現在の window を参照するや開いた親 Windown を参照するといった、以下のような関連するプロパティがあります。
詳しくはWindow プロパティ Example
を参照してください
Windowプロパティ | 概要 |
self | Window オブジェクト自信を取得 |
opener | 現在の Window を開いた Window を取得 |
top | Window の階層の最上位の Window の参照を取得 |
window | カレント Window オブジェクト |
scroll() メソッド
Window.scroll()
scroll() メソッドは、 指定されたページの位置にスクロールをして移動します。
scrollTo() メソッドと同じ動きをします。
scroll() メソッドは、web ページの全体の左上端が基準になります。絶対位置による指定と呼ばれます。
スクロール可能なページでなければスクロールはしません。スクロールが可能になるとスクロールバーが表示されています。
Syntax
in JavaScript
window.scrollBy();とも記述できます。
scroll( X, Y );
scroll( object );
引数(Parameter Values)
スクロール位置を数値で指定します。単位はピクセルです。
引数に連想配列(オブジェクト)を渡すこともできます。
引数 | 概要 |
X | 水平方向の移動位置を数値で |
Y | 垂直方向の移動位置を数値で |
object | 連想配列(オブジェクト)で指定。値は以下を参照 |
- objectの値
-
{ left=水平方向の移動位置。Xに同じ,
top=垂直方向の移動位置。Yに同じ,
behavior=['auto'|'instant'|'smooth'] }
'auto'..デフォルト。'instant'に同じ
'instant'.. 瞬時に移動
'smooth'.. 指定位置まで滑らかな描写
返り値(Return Values)
返り値はないです。
Example
scroll() メソッドの例です。
以下のscroll() を実行
ボタンをクリックするとこのページの指定位置にスクロールします。
scrollBy() メソッド
Window.scrollBy()
scrollBy() メソッドは、 現在の位置から指定されたページの位置にスクロールをして移動します。水平方向と垂直方向の指定数分を移動します。
指定数の単位はピクセルです。マイナスの値も指定できます。マイナスの値では基準方向に移動します。
scrollBy() メソッドは相対位置による指定で現在位置が基準になります。
open() メソッドで開いた単独のフル画面表示ではないウィンドウが対象です。複数の Window をともなうタブ表示されたウィンドウやフル画面表示されたウィンドウは移動できません。
Syntax
in JavaScript
window.scrollBy();とも記述できます。
scrollBy( X, Y );
引数(Parameter Values)
スクロール量を数値で指定します。単位はピクセルです。
引数に連想配列(オブジェクト)を渡すこともできます。
引数 | 概要 |
X | 水平方向の移動量を数値で |
Y | 垂直方向の移動量を数値で |
object | 連想配列(オブジェクト)で指定。値は以下を参照 |
- objectの値
-
{ left=水平方向の移動位置。Xに同じ,
top=垂直方向の移動位置。Yに同じ,
behavior=['auto'|'instant'|'smooth'] }
'auto'..デフォルト。'instant'に同じ
'instant'.. 瞬時に移動
'smooth'.. 指定位置まで滑らかな描写
返り値(Return Values)
返り値はないです。
Example
scrollBy() メソッドの例です。以下の確認
ボタンをクリックしてください。新たな Window でページを開きます。
そのページにあるscrollBy() を実行
ボタンをクリックするとそのウィンドウが移動します。
scrollTo() メソッド
Window.scrollTo()
scrollTo() メソッドは、指定されたページの位置にスクロールをして移動します。
scrollTo() メソッドは、web ページの全体の左上端が基準になります。絶対位置による指定と呼ばれます。
スクロール可能なページでなければスクロールはしません。スクロールが可能になるとスクロールバーが表示されています。
Syntax
in JavaScript
window.scrollTo();とも記述できます。
scrollTo( X, Y );
scrollTo( object );
引数(Parameter Values)
スクロール位置を数値で指定します。単位はピクセルです。
引数に連想配列(オブジェクト)を渡すこともできます。
引数 | 概要 |
X | 水平方向の移動位置を数値で |
Y | 垂直方向の移動位置を数値で |
object | 連想配列(オブジェクト)で指定。値は以下を参照 |
- objectの値
-
{ left=水平方向の移動位置。Xに同じ,
top=垂直方向の移動位置。Yに同じ,
behavior=['auto'|'instant'|'smooth'] }
'auto'..デフォルト。'instant'に同じ
'instant'.. 瞬時に移動
'smooth'.. 指定位置まで滑らかな描写
返り値(Return Values)
返り値はないです。
Example
scrollTo() メソッドの例です。
以下のscrollTo() を実行
ボタンをクリックするとこのページの指定位置にスクロールします。