Как сделать плавный скролл на CSS (смягчение скролла) на сайте?

Question

[Антон]

Как сделать плавный скролл мышкой(скроллом) на CSS?
Подскажите есть ли такая возможность, может кто знает.

Гугление приводит только на scroll-behavior, но это другое.

Comments

[modelair]

плавный скролл для страниц, который вы хотите - чистой воды издевательство над пользователями сенсорных экранов, сенсорных мышей и тачпадов.
не рекомендую.

Answer 1

[Aleksey Solovyev]

Поведение скрола регулируется браузером. В chrome через флаги установить можно: chrome://flags/#smooth-scrolling
Если вы хотите изменить поведение скрола на сайте (смягчить, добавить инерции и тд), то только через кастомные скролы. Например: https://locomotivemtl.github.io/locomotive-scroll/

Answer 2

[Владимир Юрченков]

Либо писать на JS что-то подобное

window.addEventListener("wheel", function(event) {
  event.preventDefault();

  let scrollAmount = 0;
  const scrollStep = 30; // Шаг скролла за один раз
  const scrollInterval = 10; // Скорость прокрутки

  const scroll = setInterval(function() {
    if (scrollAmount < Math.abs(event.deltaY)) {
      window.scrollBy(0, event.deltaY > 0 ? scrollStep : -scrollStep);
      scrollAmount += scrollStep;
    } else {
      clearInterval(scroll);
    }
  }, scrollInterval);
}, { passive: false });

Либо использовать готовые либлы *-scroll\scrollbar