timeline-scope
A powerful property for scroll-driven animations. It allows you to 'broaden' the scope of a named scroll timeline so it can be accessed by elements outside of the immediate parent/child relationship.
It is documented as part of the Scroll-driven Animations specification.
Syntax
/* Usage Example */
.grandparent {
/* Decalres that a child's timeline can be used by any of its descendants or siblings */
timeline-scope: --main-timeline;
}
/* Syntax */
timeline-scope: none;
/* Global values */
timeline-scope: inherit;
timeline-scope: initial;
timeline-scope: revert;
timeline-scope: revert-layer;
timeline-scope: unset;timeline-scope Browser support
Limited availability
Since
2020 78% global usage
This feature is not Baseline because it does not work in some of the most widely-used browsers.
116+
116+
Your first month is free
Managed WordPress hosting for faster sites.
Learn more