view-timeline
A shorthand for defining a scroll timeline that is tied to when an element enters and leaves the visible part of the screen (the viewport). It's the core of modern 'reveal on scroll' animations.
Usage example
.revealing-box {
view-timeline: --reveal block;
animation-timeline: --reveal;
/* animation starts when the box enters the viewport */
}Initial value
See individual properties
Inherited
No
Applies to
allElements
Values
view-timeline-nameview-timeline-axisview-timeline-inset view-timeline Browser Support
Limited availability 80% global usage
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Not ready for production without a fallback.
115+
114+
115+