跨浏览器:仅检测滚动位置JS

问题描述 投票:0回答:1

我已经在上下搜索这个问题的答案,但最终我找到了。我写这篇文章的目的是希望为将来的程序员节省很多时间和沮丧。

[如果您想添加一些内容或有任何疑问,请在下面评论,我会添加它。随着人们提出问题,这将成为更完整的答案。

javascript html scroll horizontal-scrolling vertical-scrolling
1个回答
6
投票

这是在三种主要浏览器(IE,Chrome,Firefox)上查找/检测滚动条位置的解决方案。如果您发现这些浏览器的版本不起作用,请告诉我,我将编辑此答案以包含该信息。

Older versions of chrome:
var scrollTop = document.body.scrollTop; //Chrome
var scrollLeft = document.body.scrollLeft; //Chrome

Chrome > v.78.0.3904.97 (That I know of)
var scrollTop = window.scrollY; //Chrome
var scrollLeft = window.scrollX; //Chrome

Other Browsers:
var otherScrollTop = document.documentElement.scrollTop; //IE & Firefox
var otherScrollLeft = document.documentElement.scrollLeft; //IE & Firefox

这些变量将检测整个页面的滚动位置。

正如@Eloy Pineda提到的那样:您可以使用以下更加简洁的形式写成:

var scrollTop = window.scrollY || document.body.scrollTop || document.documentElement.scrollTop;
var scrollLeft = window.scrollX || document.body.scrollLeft || document.documentElement.scrollLeft;
© www.soinside.com 2019 - 2024. All rights reserved.