CSS/Funktionen/scroll()

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
Browserunterstützung
caniuse.com

Die CSS-Funktion scroll() kann zusammen mit animation-timeline verwendet werden, um ein scrollbares Element und eine Scrollbar-Achse anzugeben, die eine anonyme Scroll-Fortschrittszeitleiste für die Animation des aktuellen Elements bereitstellen.

Die Scroll-Fortschrittszeitleiste wird durch Scrollen des Scrollers zwischen oben und unten (oder links und rechts) durchlaufen. Die Position im Scrollbereich wird in einen Prozentsatz des Fortschritts umgewandelt – 0 % am Anfang und 100 % am Ende.

anwendbar auf
Parameter
scroll(<scroller> <axis>)
  • Scroller: Der Wert zur Angabe des Scroller-Elements, das die Zeitleiste für den Scroll-Fortschritt bereitstellt:
    • nearest
    • root
    • self
  • Axis: Scrollbar-Achse
    • block
    • inline
    • x
    • y
Beispiel 
animation-timeline: scroll();
/* Values for selecting the scroller element */
animation-timeline: scroll(nearest); /* Default */
animation-timeline: scroll(root);
animation-timeline: scroll(self);
/* Values for selecting the axis */
animation-timeline: scroll(block); /* Default */
animation-timeline: scroll(inline);
animation-timeline: scroll(y);
animation-timeline: scroll(x);
/* Examples that specify scroller and axis */
animation-timeline: scroll(block nearest); /* Default */
animation-timeline: scroll(inline root);
animation-timeline: scroll(x self);
 

Siehe auch

Weblinks

Abgerufen am 7.12.2025
von "http://wiki.selfhtml.org/wiki/CSS/Funktionen/scroll()"