Animation: Animation() コンストラクター
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年3月.
Animation() はウェブアニメーション API のコンストラクターで、新しい Animation オブジェクトのインスタンスを返します。
構文
new Animation()
new Animation(effect)
new Animation(effect, timeline)
引数
effect省略可-
アニメーションに割り当てる、
AnimationEffectインターフェイスに基づくオブジェクトとして対象となる効果です。将来的にはSequenceEffectやGroupEffectなどの他の効果も利用できるようになるかもしれませんが、現在のところ利用できる効果はKeyframeEffectだけです。これはnull(これが既定値です)にすると、効果を適用しないことを示します。 timeline省略可-
アニメーションを関連付ける
timelineを指定します。AnimationTimelineインターフェイスに基づく型のオブジェクトを指定します。現在利用できるタイムラインはDocumentTimelineだけですが、将来的にはジェスチャーやスクロールに関連するタイムラインも利用できるようになるかもしれません。既定値はDocument.timelineですが、nullに設定することも可能です。
例
「白兎を追え」の例では、 Animation() コンストラクターを使用して Animation を rabbitDownKeyframes に対して、文書の timeline を使用して生成しています。
const rabbitDownAnimation = new Animation(
rabbitDownKeyframes,
document.timeline,
);
仕様書
| Specification |
|---|
| Web Animations> # dom-animation-animation> |
ブラウザーの互換性
Loading…