chrome和safari/firefox之间的滚动行为差异答案

【问题标题】：Scrolling behavior differences between chrome and safari/firefoxchrome和safari/firefox之间的滚动行为差异
【发布时间】：2018-10-20 03:14:14
【问题描述】：

所以我正在为我的应用程序构建一个渲染系统，该系统从集合中提取对象并通过 js 模板运行 em 以在页面滚动时创建更多子项。本质上，它检测何时到达容器底部并移除渲染元素的顶行并将一行模板化对象附加到容器底部，同样，但反向滚动到顶部。

功能本身不是问题。我已经让它在 chrome 中 100% 工作，但问题始于其他浏览器。在 chrome 中，它好像容器永远滚动，但在 safari/firefox 中，当滚动到达底部时，新行被渲染，但滚动停留在底部，所以看起来最后一行不断被下一行替换要渲染的行。

我的问题是如何确定滚动操作方式的差异，以便找出解决方案？

【问题讨论】：

【解决方案1】：

因此发生的不同之处在于 chrome 有一个他们内置的新功能，称为滚动锚定。他们添加了它，因此添加到页面的新内容不会影响滚动。它恰好是我正在构建的渲染系统的一个缺失部分，它不仅仅在 chrome 上缺失。我在自己的代码中模拟了它所做的事情，现在它可以在所有其他浏览器上正常运行。

对于好奇的人来说，chrome 对该行为有一个 css 控件，称为溢出锚：自动或无；

【讨论】：