在 Chrome 中捕捉滚动 CSS 太快/跳跃，但在其他任何地方都可以正常工作

Question

对此非常新，但我有一页有滚动捕捉功能的部分，但是当在 chrome 上查看时，过渡根本不平滑，它从一个部分跳到另一个部分太快了。 有没有办法解决这个问题？？

https://www.matthewjameswilson.com/

这是我正在使用的代码：

html {
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  scroll-padding: 50px 0 0 0;
}

section {
  height: 100vh;
  scroll-snap-align: start;
  scroll-snap-stop: always;
} 

Answer 1

你错过了在 CSS 上添加平滑属性scroll-behavior: smooth;

html {
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  scroll-padding: 50px 0 0 0;
  scroll-behavior: smooth;
}