JavaScriptのpageXOffset・pageYOffsetとは？現在のスクロール位置を取得・設定する方法を解説
pageXOffset と pageYOffset は、ページがどれだけスクロールされているかを取得・設定するためのプロパティです。
横方向（X軸）・縦方向（Y軸）のスクロール量をピクセル単位で参照できます。
pageXOffset・pageYOffsetとは？
これらのプロパティは、ウィンドウの左上からのスクロール量を表します。
- pageXOffset：横方向のスクロール量（px）
- pageYOffset：縦方向のスクロール量（px）
ページがどれだけスクロールされているかを調べたいときに便利です。
let x = window.pageXOffset;
let y = window.pageYOffset;
let y = window.pageYOffset;
→ 現在のスクロール位置を取得できます。
使用例：スクロール位置を設定する
スクロール量を直接設定することもできます。
newWin.pageXOffset = 250;
→ ウィンドウ newWin の横方向のスクロール位置を 250px に設定します。
使用例：スクロール位置を取得する
let yo = newWin.pageYOffset;
→ ウィンドウ newWin の縦方向のスクロール量が変数 yo に代入されます。
scrollTo / scrollBy との違い
- pageXOffset / pageYOffset：現在のスクロール量を「取得」する用途が中心
- scrollTo()：指定位置へスクロール
- scrollBy()：現在位置から相対的にスクロール
スクロール位置を調べたいときは pageXOffset / pageYOffset、
スクロールさせたいときは scrollTo / scrollBy を使うのが一般的です。
注意点
- 値はピクセル単位で取得される
- スクロールされていない場合は 0 が返る
- モダンブラウザでは
window.scrollX/window.scrollYと同じ意味
まとめ
pageXOffset：横方向のスクロール量pageYOffset：縦方向のスクロール量- 現在のスクロール位置を調べるのに便利
- スクロール操作には scrollTo / scrollBy を併用すると効果的
