scroll-timeline-axis
Defines the axis of a scroll container that will drive the progress of a scroll timeline — either block (vertical) or inline (horizontal).
It is documented as part of the Scroll-driven Animations specification.
Syntax
/* Usage Example */
.scroller {
/* The animation will progress as you scroll vertically */
scroll-timeline-axis: block;
scroll-timeline-name: --main-timeline;
}
/* Syntax */
scroll-timeline-axis: block;
scroll-timeline-axis: inline;
/* Global values */
scroll-timeline-axis: inherit;
scroll-timeline-axis: initial;
scroll-timeline-axis: revert;
scroll-timeline-axis: revert-layer;
scroll-timeline-axis: unset;scroll-timeline-axis Browser support
Limited availability
Since
2020 80% global usage
This feature is not Baseline because it does not work in some of the most widely-used browsers.
115+
111+
115+
Your first month is free
Managed WordPress hosting for faster sites.
Learn more