KeyframeEffect.composite
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The composite property of a KeyframeEffect resolves how an element's animation impacts its underlying property values.
Value
To understand these values, take the example of a keyframeEffect value of blur(2) working on an underlying property value of blur(3).
- replace
-
The
keyframeEffectoverrides the underlying value it is combined with:blur(2)replacesblur(3). - add
-
The
keyframeEffectis added to the underlying value with which it is combined (aka additive):blur(2) blur(3). - accumulate
-
The keyframeEffect is accumulated on to the underlying value:
blur(5).
Specifications
| Specification |
|---|
| Web Animations # dom-keyframeeffect-composite |
Browser compatibility
BCD tables only load in the browser
See also
- Web Animations API
- Property of
KeyframeEffectobjects.