Chrome 84 “奇怪”的滚动行为
最近使用 Chrome 浏览论坛的时候,总感觉使用上怪怪的,但又说不上来,后来拿出 Firefox 进行了对比,发现差异点在滚动行为上,具体效果可以看下面的 Demo
具体来说就是,“下一页”或是类似加载更多这类按钮,在点击后,按钮上方会被插入新的内容,然后页面的高度增加,导致滚动条的可滚动距离增加。按时日常的使用习惯,此时的“下一页”按钮会被挤到下方去,但最新的 Chrome 则是“反着”来,将新内容往上推,保证“下一页”按钮在视图上的位置不动。
这个效果可以由 css 属性 overflow-anchor
来控制,在不需要的元素上添加 overflow-anchor: none;
即可,具体可以查阅 MDN。但奇怪的是,这个属性目前只有 auto
、none
两种,似乎无法主动开启(auto
有的浏览器是开启的效果,有的又是关闭的效果,所以应该不算是启动的意思吧?)