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

View in English Always switch to English

ShadowRoot: getAnimations() メソッド

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年9月以降、すべてのブラウザーで利用可能です。

getAnimations()ShadowRoot のメソッドで、ターゲット要素がシャドウツリーの子孫である、現在有効なすべての Animation オブジェクトの配列を返します。この配列には CSS アニメーションCSS トランジションウェブアニメーション が含まれています。

構文

js
getAnimations()

引数

なし。

返値

Animation オブジェクトの配列 (Array) で、それぞれが呼び出された ShadowRoot の子孫である要素に現在関連付けられた 1 つのアニメーションを表します。

次のコードでは、シャドウツリーにあるすべてのアニメーションの Animation.playbackRate を半分にすることで、アニメーションの速度を下げます。

js
let customElem = document.querySelector("my-shadow-dom-element");
let shadow = customElem.shadowRoot;
shadow.getAnimations().forEach((animation) => {
  animation.playbackRate *= 0.5;
});

仕様書

仕様書
Web Animations
# dom-documentorshadowroot-getanimations

ブラウザーの互換性

関連情報