Window pageXOffset 和 pageYOffset 属性
最后更新于:2022-03-26 22:11:12
Window pageXOffset 和 pageYOffset 属性
定义和用法
pageXOffset 和 pageYOffset 属性返回文档在窗口左上角水平和垂直方向滚动的像素。
pageXOffset 设置或返回当前页面相对于窗口显示区左上角的 X 位置。pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。
pageXOffset 和 pageYOffset 属性相等于 scrollX 和 scrollY 属性。
这些属性是只读的。
语法
window.pageXOffset
window.pageYOffset
window.pageYOffset
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
属性 | |||||
---|---|---|---|---|---|
pageXOffset | Yes | 9.0 | Yes | Yes | Yes |
pageYOffset | Yes | 9.0 | Yes | Yes | Yes |
所有主流浏览器都支持 pageXOffset 和 pageYOffset 属性。
注意: IE 8 及 更早 IE 版本不支持该属性,但可以使用 document.documentElement.scrollLeft 和 document.documentElement.scrollTop 属性 。
实例
实例
垂直和水平滚动 100 个像素的内容,并弹出 pageXOffset 和 pageYOffset:
window.scrollBy(100, 100);
alert("pageXOffset: " + window.pageXOffset + ", pageYOffset: " + window.pageYOffset);
alert("pageXOffset: " + window.pageXOffset + ", pageYOffset: " + window.pageYOffset);
实例
兼容方案 (在 IE8 其更早版本中使用 scrollLeft 和 scrollTop):
window.scrollBy(100, 100);
alert("水平滚动: " + window.pageXOffset
+ ", 垂直滚动: " + window.pageYOffset);
} else { // IE9 及更早版本
alert("水平滚动: " + document.documentElement.scrollLeft
+ ", 垂直滚动: " + document.documentElement.scrollTop);
}
if (window.pageXOffset !== undefined) { // 所有浏览器,除了 IE9 及更早版本
alert("水平滚动: " + window.pageXOffset
+ ", 垂直滚动: " + window.pageYOffset);
} else { // IE9 及更早版本
alert("水平滚动: " + document.documentElement.scrollLeft
+ ", 垂直滚动: " + document.documentElement.scrollTop);
}