如何检测iPhone上滚动页面的比例

How can I detect what proportion of a page has been scrolled through on iPhone?

本文关键字：滚动 iPhone 何检测 检测      更新时间：2023-09-26

我想计算用户向下滚动页面的比例。我这样做的逻辑包括以下计算：

(pageYOffset + innerHeight) + document.documentElement.offsetHeight

当用户到达页面底部时，这应该（大约）等于1。

根据本页，以下不等式应始终成立：

document.documentElement.offsetHeight >= pageYOffset + innerHeight

但当我通过XCode运行iOS模拟器-iPhone 6/iOS 8.1并滚动到屏幕底部时，我得到了以下数字，其中pageYOffset实际上超过了document.documentElement.offsetHeight:

pageYOffset = 1809
innerHeight = 628
pageYOffset + innerHeight = 2437
document.documentElement.offsetHeight = 1577 // surprisingly small
document.documentElement.scrollHeight = 1577
document.documentElement.clientHeight = 559

当运行iOS模拟器-iPad Air/iOS 8.1通过XCode时，不等式两个值更接近：

pageYOffset = 1286
innerHeight = 985
pageYOffset + innerHeight = 2271
document.documentElement.offsetHeight = 2270
document.documentElement.scrollHeight = 2270
document.documentElement.clientHeight = 960

对此有什么解释吗？有没有更好的方法来计算滚动页面的比例？

我通过复制JQuery方法实现了预期的结果：

var d = document.documentElement, b = document.body;
var documentHeight = Math.max(d.scrollHeight, d.clientHeight, d.offsetHeight,
                              b.scrollHeight, b.offsetHeight);

document.body.scrollHeight比其他四个字段大，给了我想要的结果。

相关文章：