animation-trigger
An 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.
It is documented as part of the CSS Animations specification. This is an experimental technology. The syntax and behavior are still subject to change.
Syntax
/* Usage Example */
.box {
/* Experimental: Animation only plays when it enters the viewport */
animation-trigger: view();
}
/* Syntax */
animation-trigger: none;
/* Global values */
animation-trigger: inherit;
animation-trigger: initial;
animation-trigger: revert;
animation-trigger: revert-layer;
animation-trigger: unset;animation-trigger Browser support
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Your first month is free
Managed WordPress hosting for faster sites.