<set>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Das <set> SVG-Element bietet eine Methode, um den Wert eines Attributs für eine bestimmte Dauer festzulegen.
Es unterstützt alle Attributtypen, einschließlich solcher, die nicht sinnvoll interpoliert werden können, wie String- und Boolean-Werte. Für Attribute, die sinnvoll interpoliert werden können, wird normalerweise das <animate> bevorzugt.
Hinweis: Das <set>-Element ist nicht additiv. Die Attribute additive und accumulate sind nicht erlaubt und werden ignoriert, falls sie angegeben werden.
Nutzungskontext
| Kategorien | Animationselement |
|---|---|
| Erlaubter Inhalt | Beliebige Anzahl folgender Elemente, in beliebiger Reihenfolge: Beschreibende Elemente |
Attribute
to-
Dieses Attribut definiert den Wert, der auf das Zielattribut für die Dauer der Animation angewendet werden soll. Der Wert muss den Anforderungen des Zielattributs entsprechen. Wertetyp: <anything>; Standardwert: keiner; Animierbar: nein
DOM-Schnittstelle
Dieses Element implementiert die SVGSetElement-Schnittstelle.
Beispiel
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg"> <style> rect { cursor: pointer; } .round { rx: 5px; fill: green; } </style> <rect id="me" width="10" height="10"> <set attributeName="class" to="round" begin="me.click" dur="2s" /> </rect> </svg> Spezifikationen
| Specification |
|---|
| SVG Animations Level 2> # SetElement> |
Browser-Kompatibilität
Siehe auch
attributeName-Attribut- Animationstiming-Attribute, einschließlich
begin,dur,end,min,max,restart,repeatCount,repeatDur, undfill. <animate>