🫤 Unexpected: when scrolling an HTML element, the exact value of "scrollTop" depends on the browser's zoom level! Don't rely on it being an integer.
The expected behavior is to have a 1px resolution for scrollTop (or 1/devicePixelRatio, to be precise, which is the minimum step; setting scrollTop=100.1 will be rounded to scrollTop=100).
But at 110% or 90%, the values are not integers!
to reproduce:
html```
<html>
<h1 id="result">scrollTop:</h1>
<div id="test" style="width: 500px; height: 400px; overflow: auto; scrollbar-width: none; background: #dd8;">
<div style="width: 500px; height: 1000px"></div>
</div>
<script>
const test = document.getElementById("test");
const result = document.getElementById("result");
test.addEventListener("scroll", (e) => {
result.textContent = "scrollTop: " + e.target.scrollTop;
});
</script>
</html>
```
Sylvain Lesage