animation-trigger
ExperimentalAn experimental property that allows you to define exactly when an animation should start playing based on conditions like visibility in the viewport. It's part of the effort to make scroll and view-driven effects more declarative.
Quick example
.box {
/* Experimental: Animation only plays when it enters the viewport */
animation-trigger: view();
}Quick facts
Initial value
noneInherited
No
Applies to
all elements
Animation type
notAnimatable
Values
none animation-trigger Browser Support
Limited availability Unknown 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.
146+
146+