KeyframeEffect: setKeyframes() メソッド
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年7月.
setKeyframes() は KeyframeEffect インターフェイスのメソッドで、影響する KeyframeEffect を構成するキーフレームを、新しいキーフレームのセットに設定して置き換えます。
構文
js
setKeyframes(keyframes)
引数
返値
なし (undefined)。
例外
| 例外 | 説明 |
|---|---|
TypeError |
1 つ以上のフレームが正しいオブジェクト型でなかったか、キーフレームがオフセット順に緩やかに並べ替えられていなかったか、オフセットに 0 未満または 1 を超えるキーフレームが存在していた場合。 |
メモ:
キーフレームが処理できない場合、または不正な形式である場合、KeyframeEffectのキーフレームは変更されません。
例
js
// キーフレームオブジェクトの配列を渡す
existingKeyframeEffect.setKeyframes([
{ color: "blue" },
{ color: "green", left: "10px" },
]);
// 値の配列をオブジェクトで渡す
existingKeyframeEffect.setKeyframes({
color: ["blue", "green"],
left: ["0", "10px"],
});
// 単一メンバーのオブジェクトを渡す
existingKeyframeEffect.setKeyframes({
color: "blue",
});
仕様書
| Specification |
|---|
| Web Animations # dom-keyframeeffect-setkeyframes |