javascript - 获取滚动位置的正确方法

标签 javascript reactjs window react-dom

在我的应用程序中,我想确定当前的滚动位置,所以我一直在使用它(来源:https://www.codegrepper.com/code-examples/javascript/get+current+scroll+position+javascript)

window.pageYOffset || document.documentElement.scrollTop 

问题:当我对它进行 console.log 时,它只在页面未定位且位于顶部时返回 0。

问题:是否有其他方法获取当前滚动位置?

最佳答案

最近我遇到了同样的问题。因此,为了获得百分比位置,我最终执行以下操作

window.addEventListener("scroll", function() {

    const maxHeight = document.body.scrollHeight - window.innerHeight;
    console.log((window.pageYOffset * 100) / maxHeight);
});

我们从 document.body.scrollHeight 中减去 window.innerHeight 因为 window.pageYOffset 代表视口(viewport)的顶部。因此,为了使 window.pageYOffsetdocument.body.scrollHeight 匹配,我们进行了上述减法。

PS.: 以上返回一个 float 。如果您愿意,可以使用 parseInt(...) 将其转换为整数。

关于javascript - 获取滚动位置的正确方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/72535969/

相关文章:

javascript - 为什么 const 名称需要在 ReactJS 中用大括号括起来

actionscript-3 - 以编程方式设置 AIR 窗口位置?

ios - 从 Windows 启用 iPhone(带有 iOS7)调试控制台

javascript - 使用 JS 检查此场景中是否存在 html 标签

javascript - 多维数组 JAVASCRIPT 出了问题

javascript - 奇怪的(对我来说)编写 script.js/jquery 文件的方式

java - 渲染 JSP 页面后设置 ng-model

javascript - .jsx 和 .js 文件之间的技术区别是什么

javascript - startWith 运算符 Rxjs 未按预期工作

scripting - 我可以使用 Applescript 来控制程序而不将该程序带到前台吗?