检查用户是否以亚像素精度纪元滚动到底部

Check if a user has scrolled to the bottom in subpixel precision era(检查用户是否以亚像素精度纪元滚动到底部)

本文介绍了检查用户是否以亚像素精度纪元滚动到底部的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我找到了检查内容是否已滚动到底部的经典MDN公式

element.scrollHeight - element.scrollTop === element.clientHeight

不再适用于所有情况。例如,如果将demo page on MDN的内容比例更改为大于100%的值,则不会获得正确的结果。这是因为现在浏览器对元素使用subpixel precision。特别是scrollTop,因为现在不是100%的比例是小数值。实际上,出现此问题是因为上面公式中的===号。

因此需要最简单但仍然可靠的解决方案。

推荐答案

我当前的解决方案:

function isContentScrolledToBottom(element) {
    const rest = element.scrollHeight - element.scrollTop;
    return Math.abs(element.clientHeight - rest) < 1;
}

它检查元素是否以±1的精度滚动到底部。

这篇关于检查用户是否以亚像素精度纪元滚动到底部的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本文标题为:检查用户是否以亚像素精度纪元滚动到底部

基础教程推荐