Свойство CSS overscroll-behavior

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

overscroll-behavior Атрибуты используются для отключения цепочки прокрутки (scroll chaining) или обратной связи при переборке (overscroll affordance) при попытке прокрутить за пределы границ прокрутки.

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

Обратная связь при переборке: это обратная связь, предоставляемая пользователю при попытке прокрутки за пределы границ прокрутки. Например, при попытке прокрутить за пределы верха страницы на мобильном устройстве, обычно отображается визуальная обратная связь и обновляется страница.

overscroll-behavior 属性是以下属性的简写形式：

• Свойство является сокращением следующих свойств:
• overscroll-behavior-x

overscroll-behavior overscroll-behavior-y

Значение свойства можно установить несколькими способами:

Если у свойства overscroll-behavior есть два значения:

• overscroll-behavior: none contain;
• x направление: нет поведения переборки

y направление: нет цепочки скроллинга, но разрешена обратная связь при переборке

#yellowDiv {

• Если у свойства overscroll-behavior есть один значений:

x и y направления: нет цепочки скроллинга, но разрешена обратная связь при переборке

Пример

Пример 1

Закрытие цепочки скроллинга для элемента <div>, который можно скроллить:
  #yellowDiv {
}

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

overscroll-behavior: contain;

Пример 2: двустрочный синтаксис: overscroll-behavior Значение атрибута установлено в auto noneПозволяет скроллингу и обратной связи при переборке по x-оси, но не позволяет по y-оси:

#pinkDiv {
  overscroll-behavior: auto none;
}

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

CSS синтаксис

overscroll-behavior: auto|contain|none|initial|inherit;

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

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

Поддержка браузеров

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

* В Microsoft Edge значение атрибута 'none' обрабатывается как 'contain', что является неправильным.

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

См. также:Свойство CSS overscroll-behavior-x

См. также:Свойство CSS overscroll-behavior-y

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

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

См. также:Атрибут scroll-padding CSS

См. также:Атрибут scroll-snap-align CSS