KeyframeEffect: setKeyframes() method
Baseline 2022
Newly available
Since September 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The setKeyframes() method of the KeyframeEffect interface replaces the keyframes that make up the affected KeyframeEffect with a new set of keyframes.
Syntax
js
setKeyframes(keyframes)
Parameters
Return value
None (undefined).
Exceptions
| Exception | Explanation |
|---|---|
TypeError |
One or more of the frames were not of the correct type of object, the keyframes were not loosely sorted by offset, or a keyframe existed with an offset of less than 0 or more than 1. |
Note: If the keyframes cannot be processed or are malformed, the KeyframeEffect's keyframes are not modified.
Examples
js
// passing an array of keyframe objects
existingKeyframeEffect.setKeyframes([
{ color: "blue" },
{ color: "green", left: "10px" },
]);
// passing an object with arrays for values
existingKeyframeEffect.setKeyframes({
color: ["blue", "green"],
left: ["0", "10px"],
});
// passing a single-member object
existingKeyframeEffect.setKeyframes({
color: "blue",
});
Specifications
| Specification |
|---|
| Web Animations # dom-keyframeeffect-setkeyframes |
Browser compatibility
BCD tables only load in the browser