我知道这里有很多类似的问题，但是我找不到能回答这个问题的问题。我正在使用IntersectionObserver来触发导航栏样式（以缩小样式）。导航栏具有sticky-top类，以视口为根（隐式）。
一个微妙的问题是，在重新加载页面时，会记住滚动位置，但是随着导航栏的缩小，滚动位置似乎会调整。这将导致在随后的重新加载时逐渐“爬升”页面。我不希望用户不断刷新页面，但是我想彻底了解正在发生的事情以及发生这种情况的原因。
Here is a jsfiddle which demonstrate the issue.
要查看此问题，请向下滚动内容框架，直到导航栏缩小，然后右键单击该框架以重新加载该框架（因为重新加载整个jsfiddle页面将重置所有内容，包括滚动位置）。
我有一个理论是在position: sticky;样式有效position: fixed;之前恢复滚动位置，因此导航栏的高度偏离了滚动位置。
但是，滚动位置似乎仅移动了少量。这使我相信浏览器足够聪明，足以说明从页面流中删除了粘性元素，并说明了差异，但它无法提前知道该元素将缩小。不过，这仍然让我感到困惑，因为导航条从页面流中删除后的大小与恢复的滚动位置无关。
我有一个预感，就是某种竞争条件导致了这种情况，其中相关事件是滚动还原，触发元素上的IntersectionObserver事件以及瘦导航栏样式的应用。谁能对此有所启发？