Snap Scroll CSS слишком быстрый/дерганый в Chrome, но отлично работает везде

avatar
Matthew Wilson
8 августа 2021 в 17:08
585
1
1

Я очень новичок в этом, но у меня есть страница с разделами, на которой есть функция привязки прокрутки, но при просмотре в 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;
} 
Источник
Mohamed Raza
8 августа 2021 в 17:15
1

Отвечает ли это на ваш вопрос? Плавная прокрутка в CSS

Ответы (1)

avatar
Mohamed Raza
8 августа 2021 в 17:17
0

вы пропустили добавление гладкого атрибута scroll-behavior: smooth; в CSS

html {
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  scroll-padding: 50px 0 0 0;
  scroll-behavior: smooth;
}
Matthew Wilson
9 августа 2021 в 20:46
0

добавил scroll-behavior: smooth , но без изменений при просмотре в Chrome. Особенно плохо с прокруткой мыши, не так уж плохо с сенсорной панелью. Спасибо за вашу помощь!

Mohamed Raza
9 августа 2021 в 21:33
0

Вы можете поместить свой код в codepen. поэтому я могу проверить и обновить ответ

Neo.Mxn0
23 декабря 2021 в 14:01
0

Вы получили результат? поведение прокрутки: гладкость не гладкая, как я хочу, могу ли я настроить время прокрутки?

Mohamed Raza
23 декабря 2021 в 15:33
0

да который отлично работает