Baseline Widely available *
Das CSSKeyframesRule-Interface beschreibt ein Objekt, das eine vollständige Reihe von Keyframes für eine CSS-Animation darstellt. Es entspricht dem Inhalt einer gesamten @keyframes At-Regel.
Erbt Eigenschaften von seinem Vorfahren CSSRule.
CSSKeyframesRule.name
Repräsentiert den Namen der Keyframes, der durch die animation-name-Eigenschaft verwendet wird.
CSSKeyframesRule.cssRules Schreibgeschützt
Gibt eine CSSRuleList der Keyframes in der Liste zurück.
CSSKeyframesRule.length Schreibgeschützt
Gibt die Anzahl der Keyframes in der Liste zurück.
Erbt Methoden von seinem Vorfahren CSSRule.
CSSKeyframesRule.appendRule()
Fügt eine neue Keyframe-Regel in die aktuelle CSSKeyframesRule ein. Der Parameter ist ein String, der ein Keyframe im gleichen Format wie ein Eintrag in einer @keyframes-At-Regel enthält. Wenn der String mehr als eine Keyframe-Regel enthält, wird eine DOMException mit einem SYNTAX_ERR ausgelöst.
CSSKeyframesRule.deleteRule()
Löscht eine Keyframe-Regel aus der aktuellen CSSKeyframesRule. Der Parameter ist der Index des zu löschenden Keyframes, ausgedrückt als ein String, der als Zahl zwischen 0% und 100% aufgelöst wird.
CSSKeyframesRule.findRule()
Gibt eine Keyframe-Regel zurück, die dem angegebenen Schlüssel entspricht. Der Schlüssel ist ein String, der einen Index des zurückzugebenden Keyframes enthält, der als Prozentsatz zwischen 0% und 100% aufgelöst wird. Wenn kein solcher Keyframe existiert, gibt findRule null zurück.
Das CSS enthält eine Keyframes-At-Regel. Dies wird die erste CSSRule sein, die von document.styleSheets[0].cssRules zurückgegeben wird. myRules[0] gibt ein CSSKeyframesRule-Objekt zurück.
@keyframes slide-in {
from {
transform: translateX(0%);
}
to {
transform: translateX(100%);
}
}
const myRules = document.styleSheets[0].cssRules;
const keyframes = myRules[0]; // a CSSKeyframesRule
CSSKeyframesRule kann ähnlich wie ein Array indiziert werden und funktioniert ähnlich wie seine cssRules-Eigenschaft.
const keyframes = document.styleSheets[0].cssRules[0];
for (let i = 0; i < keyframes.length; i++) {
console.log(keyframes[i].keyText);
}
// Output:
// 0%
// 100%
Diese Seite wurde automatisch aus dem Englischen übersetzt.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4