Клавиша / esc

scroll-snap-stop

Задаёт обязательность остановки прокрутки в каждой точке привязки.

Время чтения: меньше 5 мин

Кратко

Скопировано

Свойство scroll-snap-stop определяет, должен ли скролл обязательно останавливаться в каждой точке привязки при прокрутке.

Пример

Скопировано
        
          
          .element {  scroll-snap-stop: always;}
          .element {
  scroll-snap-stop: always;
}

        
        
          
        
      

Как понять

Скопировано

Свойство scroll-snap-stop управляет тем, насколько строго должна останавливаться прокрутка: на каждом элементе или с возможным пропуском элементов.

Как пишется

Скопировано

Возможные значения scroll-snap-stop:

  • normal — прокрутка может проскочить несколько элементов, значение по умолчанию;
  • always — прокрутка должна остановиться на каждом элементе.

Использование

Скопировано
        
          
          .scroll-snap-stop-normal {  scroll-snap-stop: normal;}.scroll-snap-stop-always {  scroll-snap-stop: always;}
          .scroll-snap-stop-normal {
  scroll-snap-stop: normal;
}

.scroll-snap-stop-always {
  scroll-snap-stop: always;
}

        
        
          
        
      

Попробуйте прокрутить каждый из контейнеров с небольшим ускорением. Эффект от свойства можно увидеть на тач-экранах или устройствах с тачпадом.

Открыть демо в новой вкладке