JSFiddle - React, Tailwind, and code Playground

HTML

<!--
In Safari, drag the scrollbar slowly down.
When it goes past 50px, the scroll position will jump to the top
-->
<div style="display: inline-grid; grid-template-rows: minmax(0, 1fr); max-height: 100px;">
  <div style="overflow: auto; width: 200px;">
    <div style="height: 100px;"></div>
    <div style="height: 100px;"></div>
  </div>
</div>

JavaScript

document.querySelector("div > div").addEventListener("scroll", e => {
	if (e.target.scrollTop > 50) {
    e.target.childNodes[1].style.height = "101px";
  }
});