封装兼容：查看滚动条滚动距离

最新推荐文章于 2023-10-27 09:37:11 发布

原创最新推荐文章于 2023-10-27 09:37:11 发布 · 188 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#封装兼容 #查看滚动条滚动距离

兼容专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种封装方法，用于获取浏览器中滚动条的滚动距离，适用于W3C标准浏览器和IE8以下版本。通过window.pageXOffset/window.pageYOffset和document.body/document.documentElement的scrollLeft/scrollTop属性，实现了一个兼容多种浏览器的滚动偏移量获取函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

封装兼容：查看滚动条滚动距离

查看滚动条滚动距离的方法：
1、W3C标准浏览器：window.pageXOffset/window.pageYOffset;
2、IE8以下：document.body.scrollLeft/scrollTop或者document.documentElement.scrollLeft/scrollTop,因为其中一个方法有值的情况下，另一个方法的输出结果必定为0，所以可以相加使用。

封装：

function getScrollOffset(){
	if(window.pageXOffset ||window.pageYOffset){
		return {
			x : window.pageXOffset,
			y : window.pageYOffset
		}
	}else{
		return {
			x : document.body.scrollLeft + document.documentElement.scrollLeft,
			y : document.body.scrollTop + document.documentElement.scrollTop
		}
	}
}