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.
Want more support for this feature? Tell us why.
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
/* 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
| Anfangswert | auto |
|---|---|
| Anwendbar auf | nicht ersetzte Blocklevel Elemente und nicht ersetzte Inlineblock Elemente |
| Vererbt | Nein |
| Berechneter Wert | wie angegeben |
| Animationstyp | diskret |
Formale Syntax
overscroll-behavior-y =
contain |
none |
auto |
chain
Beispiele
>Verhindern, dass ein darunterliegendes Element vertikal scrollt
.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> |