CSS Overscroll-Verhalten
Das CSS Overscroll-Verhalten Modul bietet Eigenschaften zur Steuerung des Verhaltens eines Scroll-Containers, wenn dessen Scroll-Position den Scroll-Grenzwert erreicht. Diese Kontrolle ist besonders nützlich in Szenarien, in denen eingebettete scrollbare Bereiche nicht das Scrollen des übergeordneten Containers auslösen sollen.
Beim Kommentieren in einem Blog könnten Sie bemerken, dass wenn Ihr Kommentar die Länge des bereitgestellten <textarea>
übersteigt, das Scrollen über das Ende des Textbereichs hinaus den gesamten Blog scrollen lässt. Dies liegt daran, dass das Erreichen des Endes eines scrollbaren Bereichs, bekannt als der Scroll-Grenzwert, dazu führen kann, dass andere Inhalte oder die gesamte Seite gescrollt werden. Diese kontinuierliche Scroll-Erfahrung wird als Scroll-Chaining bezeichnet.
In Situationen, in denen der Inhalt eines Elements größer ist als sein Container und overflow
das Scrollen zulässt oder standardmäßig aktiviert ist (wie in <textarea>
), initiiert das Weiter-Scrollen über den scrollbaren Bereich des Elements hinaus das Scrollen im übergeordneten Element oder auf der darunter liegenden Seite.
Andererseits, beim Scrollen durch die Allgemeinen Geschäftsbedingungen einer Website und dem Erreichen des Endes des Inhalts, um ein Kontrollkästchen zu aktivieren, kann es sein, dass die Seite nicht gezwungen wird, zu scrollen oder zu springen (wie auf einem Telefon). Dieses Beispiel zeigt, dass Sie das Overscroll-Verhalten kontrollieren und Scroll-Chaining verhindern können.
Dieses Modul definiert das Overscroll-Verhalten und ermöglicht es Ihnen, die Aktionen zu spezifizieren, wenn ein Benutzer über die Grenzen eines scrollbaren Elements hinaus scrollt.
Referenz
CSS Eigenschaften
Glossarbegriffe
Leitfäden
- Lernen: Überlaufender Inhalt
-
Erfahren Sie, was Überlauf ist und wie Sie ihn verwalten.
Verwandte Konzepte
-
scrollbar
ARIA-Rolle -
Enthaltender Block Konzept
-
CSS Overflow Modul:
overflow
Kurzform-Eigenschaftoverflow-clip-margin
Eigenschaftscroll-behavior
Eigenschafttext-overflow
Eigenschaft
-
Scroll-Container und Scrollport Glossarbegriffe
-
CSS Scroll Snap Modul:
scroll-padding
Kurzform-Eigenschaftscroll-snap-type
Eigenschaftscroll-margin
Kurzform-Eigenschaftscroll-snap-stop
Eigenschaftscroll-snap-align
Eigenschaft
-
CSSOM View Modul:
Element.getBoundingClientRect()
MethodeElement.scroll()
MethodeElement.scrollBy()
MethodeElement.scrollIntoView()
MethodeElement.scrollTo()
Methodescroll
Dokumentereignis
Spezifikationen
Specification |
---|
CSS Overscroll Behavior Module Level 1 |
Siehe auch
- CSS Box-Modell Modul
- CSS Logische Eigenschaften und Werte Modul
- CSS Scroll Snap Modul
- Take control of your scroll - customizing pull-to-refresh and overflow effects auf developer.chrome.com (2017)