Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

overscroll-behavior-y CSS property

Eingeschränkt verfügbar

Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.

Die overscroll-behavior-y-Eigenschaft CSS legt fest, wie sich der Browser verhält, wenn die vertikale Grenze eines Scrollbereichs erreicht wird.

Siehe overscroll-behavior für eine vollständige Erklärung.

Syntax

css
/* Keyword values */
overscroll-behavior-y: auto; /* default */
overscroll-behavior-y: contain;
overscroll-behavior-y: none;

/* Global values */
overscroll-behavior-y: inherit;
overscroll-behavior-y: initial;
overscroll-behavior-y: revert;
overscroll-behavior-y: revert-layer;
overscroll-behavior-y: unset;

Die overscroll-behavior-y-Eigenschaft wird als Schlüsselwort aus der untenstehenden Liste von Werten angegeben.

Werte

auto

Das standardmäßige Überlaufverhalten beim Scrollen tritt wie gewohnt auf.

contain

Das standardmäßige Überlaufverhalten beim Scrollen (z.B. "Bounce"-Effekte) tritt innerhalb des Elements auf, bei dem dieser Wert festgelegt ist. Es tritt jedoch kein Scroll-Chaining in benachbarten Scrollbereichen auf; die darunterliegenden Elemente werden nicht scrollen. Der contain-Wert deaktiviert die native Browsernavigation, einschließlich der vertikalen Pull-to-Refresh-Geste und der horizontalen Wischnavigation.

none

Es tritt kein Scroll-Chaining in benachbarten Scrollbereichen auf, und das standardmäßige Überlaufverhalten beim Scrollen wird verhindert.

Formale Definition

Anfangswertauto
Anwendbar aufnicht ersetzte Blocklevel Elemente und nicht ersetzte Inlineblock Elemente
VererbtNein
Berechneter Wertwie angegeben
Animationstypdiskret

Formale Syntax

overscroll-behavior-y = 
contain |
none |
auto |
chain

Beispiele

Verhindern, dass ein darunterliegendes Element vertikal scrollt

css
.messages {
  height: 220px;
  overflow: auto;
  overscroll-behavior-y: contain;
}

Siehe overscroll-behavior für ein vollständiges Beispiel und eine Erklärung.

Spezifikationen

Spezifikation
CSS Overscroll Behavior Module Level 1
# overscroll-behavior-longhands-physical

Browser-Kompatibilität

Siehe auch