KeyframeEffect: composite property
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
| desktop | mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
composite | ||||||||||||
See also
- Web Animations API
- Property of
KeyframeEffectobjects - Composite operation