Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

CSSKeyframesRule: length-Eigenschaft

Baseline 2024
Neu verfügbar

Seit March 2024 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.

Die schreibgeschützte length-Eigenschaft des CSSKeyframesRule-Interfaces gibt die Anzahl der CSSKeyframeRule-Objekte in ihrer Liste zurück. Sie können dann direkt über den Index auf jedes Keyframe-Regelobjekt im CSSKeyframeRule-Objekt zugreifen.

Wert

Eine nicht-negative Ganzzahl. Sie sollte denselben Wert wie die length-Eigenschaft der cssRules-Eigenschaft haben.

Beispiele

Das CSS enthält eine Keyframes-At-Regel. Diese wird die erste von document.styleSheets[0].cssRules zurückgegebene CSSRule sein. myRules[0] gibt ein CSSKeyframesRule-Objekt zurück. Die cssRules-Eigenschaft gibt eine CSSRuleList mit zwei Regeln zurück.

css
@keyframes slide-in {
  from {
    transform: translateX(0%);
  }

  to {
    transform: translateX(100%);
  }
}
js
const myRules = document.styleSheets[0].cssRules;
const keyframes = myRules[0]; // a CSSKeyframesRule
console.log(keyframes.length); // 2

Spezifikationen

Spezifikation
CSS Animations Level 1
# dom-csskeyframesrule-length

Browser-Kompatibilität