window.scrollY 垂直滚动条位置
示例 1
将内容滚动 100 像素,并弹出 scrollX 和 scrollY
window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);
自己动手试一试 »
更多示例见下文。
描述
scrollY
属性返回文档从窗口左上角滚动的像素数。
scrollY
属性是只读的。
注意
scrollY
属性等同于 pageYOffset
属性。
为实现跨浏览器兼容,请使用 window.pageYOffset 而不是 window.scrollY。
另请参阅
语法
window.scrollY
或者scrollY
返回值
类型 | 描述 |
一个数字 | 文档从窗口左上角滚动的像素数。 |
更多示例
创建粘性导航栏
// 获取导航栏
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
在所有浏览器中都受支持
Chrome | Edge | Firefox | Safari | Opera | IE |
是 | 是 | 是 | 是 | 是 | 9-11 |