CSSKeyframeRule: style-Eigenschaft
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2016.
Die schreibgeschützte style-Eigenschaft der CSSKeyframeRule-Schnittstelle enthält ein CSSStyleDeclaration-Objekt, das die im Körper der @keyframes-Regel verfügbaren Deskriptoren darstellt.
Wert
Ein CSSStyleDeclaration-Objekt.
Obwohl die style-Eigenschaft selbst in dem Sinne schreibgeschützt ist, dass Sie das CSSStyleDeclaration-Objekt nicht ersetzen können, können Sie dennoch direkt der style-Eigenschaft etwas zuweisen, was gleichbedeutend mit der Zuweisung zu ihrer cssText-Eigenschaft ist. Sie können das CSSStyleDeclaration-Objekt auch mit den Methoden setProperty() und removeProperty() ändern.
Beispiele
Das CSS enthält eine @keyframes-At-Regel. Diese wird die erste CSSRule sein, die von document.styleSheets[0].cssRules zurückgegeben wird.
myRules[0] gibt ein CSSKeyframesRule-Objekt zurück, das einzelne CSSKeyFrameRule-Objekte für jedes Keyframe enthalten wird.
@keyframes slide-in {
from {
transform: translateX(0%);
}
to {
transform: translateX(100%);
}
}
let myRules = document.styleSheets[0].cssRules;
let keyframes = myRules[0]; // a CSSKeyframesRule
console.log(keyframes[0].style); // a CSSStyleDeclaration
Spezifikationen
| Specification |
|---|
| CSS Animations Level 1 # dom-csskeyframerule-style |