Window pageYOffset 属性

定义和用法

pageYOffset 属性返回文档从窗口左上角滚动的像素。

pageYOffset 属性等于 scrollY 属性。

pageYOffset 属性是只读的。

另请参阅:

screenX 属性

screenY 属性

实例

例子 1

将内容滚动 100 像素,并提示 pageXOffset 和 pageYOffset:

window.scrollBy(100, 100);
alert(window.pageXOffset + window.pageYOffset);

亲自试一试

例子 2

创建粘性导航栏:

// 获取导航栏
const navbar = document.getElementById("navbar");
// 获取导航栏的偏移位置
const sticky = navbar.offsetTop;
// 当您到达其滚动位置时,将 sticky 类添加到导航栏。离开滚动位置时删除 sticky 类。
function myFunction() {
  if (window.pageYOffset >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

亲自试一试

语法

window.pageYOffset

Or:

pageYOffset

Return Value

Type Description
Number The number of pixels the document has scrolled from the top left corner of the window.

Browser Support

All Browsers Support pageYOffset:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Support 9-11 Support Support Support Support