Window scrollY 屬性

定義和用法

scrollY 屬性返回文檔從窗口左上角滾動的像素。

scrollY 屬性是只讀的。

提示

scrollY 屬性等于 pageYOffset 屬性。

為了跨瀏覽器兼容性,請使用 window.pageYOffset 而不是 window.scrollY

另請參閱:

pageXOffset 屬性

pageYOffset 屬性

實例

例子 1

將內容滾動 100 像素,并提示 scrollX 和 scrollY:

window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);

親自試一試

例子 2

創建粘性導航欄:

// 獲取導航欄
const navbar = document.getElementById("navbar");
// 獲取導航欄的偏移位置
const sticky = navbar.offsetTop;
// 當您到達其滾動位置時,將 sticky 類添加到導航欄。離開滾動位置時刪除 sticky 類。
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

親自試一試

語法

window.scrollY

或者:

scrollY

返回值

類型 描述
數字 文檔從窗口左上角滾動的像素數。

瀏覽器支持

所有瀏覽器都支持 window.scrollY

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
支持 9-11 支持 支持 支持 支持