このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

Animation: ready プロパティ

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月⁩.

Animation.readyウェブアニメーション API の読み取り専用プロパティで、アニメーションが再生可能になったときに解決するプロミス (Promise) を返します。アニメーションの再生状態"pending" になるたびに、またアニメーションが取り消される可能性があるときにも、新しいプロミスが作成されます。

メモ: 同じ Promise が保留中の play リクエストと保留中の pause リクエストの両方に使用されるので、プロミスが解決したときにアニメーションの状態を調べることをお勧めします。

アニメーションを再生する準備ができたときに解決する Promise です。プロミスの ready を使用する場合、通常これに似た構造を使用します。

js
animation.ready.then(() => {
  // アニメーションを実行する準備ができたときに
  // 必要なことを何かする
});

次の例では、現在 ready になっているプロミスが解決すると、アニメーションの状態は running になります。アニメーションは pauseplay を呼び出す間に再生状態が pending から変わらない、現在 ready になっているプロミスは変化しないからです。

js
animation.pause();
animation.ready.then(() => {
  // 'running' と表示
  alert(animation.playState);
});
animation.play();

仕様書

Specification
Web Animations
# dom-animation-ready

ブラウザーの互換性

関連情報