Как сделать плавную прокрутку колесом мыши?

Для реализации плавной прокрутки колесом мыши на веб-странице можно применить JavaScript. Вот примерный алгоритм действий:

1. Создание HTML структуры: На странице должен быть контейнер, который будет прокручиваться. Например, div с id=«content».
2. Добавление стилей CSS: Укажите стили для контейнера, чтобы он имел высоту и ширину, а также определите свойство «overflow» как «scroll» для возможности прокрутки.

3. Написание JavaScript кода:

   • Получите элемент контейнера:
     

   const container = document.getElementById('content');
   
   

   • Добавьте обработчик события прокрутки колеса мыши:

   container.addEventListener('wheel', (e) => {
   e.preventDefault();
   const scrollValue = e.deltaY * 0.5; // определяем скорость прокрутки
   container.scrollTo({
   top: container.scrollTop + scrollValue,
   behavior: 'smooth' // делаем прокрутку плавной
   });
   });
   
   

Этот код обеспечивает плавную прокрутку контейнера при вращении колеса мыши. При прокрутке колеса мыши вверх или вниз будет осуществляться плавное перемещение содержимого контейнера в соответствующем направлении.

Не забудьте адаптировать этот код под особенности вашего проекта и добавить обработку возможных ошибок.