Animation: ready プロパティ
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年7月以降、すべてのブラウザーで利用可能です。
Animation.ready はウェブアニメーション API の読み取り専用プロパティで、アニメーションが再生可能になったときに解決するプロミス (Promise) を返します。アニメーションの再生状態が "pending" になるたびに、またアニメーションが取り消される可能性があるときにも、新しいプロミスが作成されます。
メモ:
同じ Promise が保留中の play リクエストと保留中の pause リクエストの両方に使用されるので、プロミスが解決したときにアニメーションの状態を調べることをお勧めします。
値
アニメーションを再生する準備ができたときに解決する Promise です。プロミスの ready を使用する場合、通常これに似た構造を使用します。
js
animation.ready.then(() => {
// アニメーションを実行する準備ができたときに
// 必要なことを何かする
});
例
次の例では、現在 ready になっているプロミスが解決すると、アニメーションの状態は running になります。アニメーションは pause と play を呼び出す間に再生状態が pending から変わらない、現在 ready になっているプロミスは変化しないからです。
js
animation.pause();
animation.ready.then(() => {
// 'running' と表示
alert(animation.playState);
});
animation.play();
仕様書
| 仕様書 |
|---|
| Web Animations # dom-animation-ready |