Свойство scroll-snap-stop в CSS

Определение и использование

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

Чтобы контролировать поведение остановки скроллинга吸附а, необходимо установить это свойство на подэлементах scroll-snap-stop и scroll-snap-align свойство, а также в родительском элементе установлено scroll-snap-type свойство.

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

Пример

При быстром скольжении по трекпаду или сенсорному экрану, принудительно останавливается скроллинг и притягивается к следующему элементу, а не пропускается напрямую:

div {
  scroll-snap-stop: always;
}

Попробуйте сами

Синтаксис CSS

scroll-snap-stop: normal|always|initial|inherit;

Значение атрибута

Значение Описание
normal Значение по умолчанию. После быстрого скольжения по трекпаду или сенсорному экрану, скроллинг медленно замедляется и пропускает несколько элементов.
always После быстрого скольжения по трекпаду или сенсорному экрану, скроллинг останавливается и следующий элемент притягивается к фокусу.
initial Установить этот атрибут в значение по умолчанию. См. также initial.
inherit Этот атрибут наследуется от родительского элемента. См. также inherit.

Технические детали

Значение по умолчанию: normal
Ингерит: Нет
Создание анимации: Не поддерживается. См. также:Свойства анимации.
Версия: CSS3
Синтаксис JavaScript: object.style.scrollSnapStop="always"

Поддержка браузерами

Числа в таблице указывают на версию первого браузера, который полностью поддерживает этот атрибут.

Кроме Эдж Фаерфокс Сафари Опера
75.0 79.0 103.0 15.0 62.0

Соответствующие страницы

См. также:Свойство scroll-snap-align в CSS

См. также:Свойство scroll-snap-type в CSS