CSSKeyframeRule.style
CSSKeyframeRule.style
プロパティは CSSStyleDeclaration
インターフェイスであり、 CSSKeyframeRule
の宣言ブロックです。
値
CSSStyleDeclaration
オブジェクトで、次のプロパティがあります。
- readonly flag
-
未設定。
- declarations
-
このルール内で宣言された宣言で、指定された順番であり、個別指定プロパティに展開された一括指定プロパティです。
- parent CSS rule
-
コンテキストオブジェクトで、 this の別名です。
- owner node
-
null です。
例
この CSS には keyframes アットルールが記載されています。これは最初の CSSRule
であり、 document.styleSheets[0].cssRules
で返されます。
myRules[0]
は CSSKeyframesRule
オブジェクトを返し、その中に各キーフレームに対応する個々の CSSKeyFrame
オブジェクトが格納されます。
css
@keyframes slidein {
from {
transform: translateX(0%);
}
to {
transform: translateX(100%);
}
}
js
let myRules = document.styleSheets[0].cssRules;
let keyframes = myRules[0]; // a CSSKeyframesRule
console.log(keyframes[0].style); // a CSSStyleDeclaration
仕様書
Specification |
---|
CSS Animations Level 1 # dom-csskeyframerule-style |
ブラウザーの互換性
BCD tables only load in the browser