关于scroll滚动式的过渡动画

解释

现代浏览器陆续意识到了这种需求，scrollIntoView意思是滚动到可视，css中提供了scroll-behavior属性，js有Element.scrollIntoView()方法。

scroll-behavior

scroll-behavior属性可取值auto|smooth|inherit|unset

scroll-behavior: smooth;是我们想要的缓冲效果。在PC浏览器中，页面默认滚动是在标签上，移动端大多数在标签上，在我们想要实现平滑“回到顶部”，只需在这两个标签上都加上：

html,body{

scroll-behavior:smooth;

}

准确的说，写在容器元素上，可以让容器（非鼠标手势触发）的滚动变得平滑，而不局限于，标签。

利用这个css属性可以一步将原来纯css标签直接切换，变成平滑过渡切换效果。

资料