浏览器缩放更改 window.scrollTop/document.scrollTop 行为

Question

我正在尝试在用户滚动过去时读取页面的当前 y 滚动以淡入/淡出元素。

我从这个站点尝试了许多不同的解决方案，比如.scrollTop、.pageYOffset、.scrollY 等，使用 $(window) 和 $(document)、$("element")，将其转换为百分比等等......

首先它们都工作正常，但是当我放大浏览器时，我得到的结果每次都会改变：

我有这个简单的设置作为页面

<div style="height: 800px"></div>
<h1 style="" id="test"> Test </h1>
<div style="height: 2000px"></div>

例如，阅读卷轴 position：

$(window).scroll(function() {
console.log($(this).scrollTop());

当我向下滚动到测试 T 上方的 header 和 go 时，它显示为 830px。 但是当我放大（尝试过 chrome 和 firefox）时，首先我的控制台停止提供连续值并且似乎变得迟钝（？）并且去同一个地方（T 正上方）返回一个不同的值（放大时更小) 取决于我的缩放比例，例如 500 像素。

有没有解决方案，或者是否有另一种方法来实现我想要做的事情？

附加信息

• 经过更多阅读后，我知道使用 Ctrl+/- 缩放（例如更改字体大小）和使用触摸板和 2 根手指进行缩放之间的区别。 这也改变了我得到的结果，所以有时当 window.scrollY 返回 800px 时元素出现，有时当它显示 300px 时它开始出现。 我对此越来越感到困惑，也许有人可以在这里帮助我成为基础；）

• 遇到了这个：这个， 设置精确滚动 position 时捏放大声音有点像我正在经历的。

提前感谢您的任何见解！

Answer 1

我的问题已经过时了。

在阅读了有关浏览器缩放与操作系统缩放、像素与像素密度等的更多信息后。

现在一切都说得通了。