animation-delay

Dies ist eine experimentelle Technologie
Da diese Technologie noch nicht definitiv implementiert wurde, sollte die Browser Kompatibilität beachtet werden. Es ist auch möglich, dass der Syntax in einer späteren Spezifikation noch geändert wird.

Übersicht

Die animation-delay CSS Eigenschaft gibt an, wann eine Animation starten soll. Dies lässt die Animationssequenz einige Zeit später starten nachdem sie einem Element zugewiesen wurde.

Ein Wert von 0s, welcher der Standardwert für die Eigenschaft ist, gibt an, dass die Animation starten soll sobald sie zugewiesen wird. Andernfalls legt der Wert eine Verzögerung von dem Moment fest, an dem die Animation dem Element zugewiesen wird; die Animation startet um diesen Wert verzögert nachdem sie zugewiesen wurde.

Falls ein negativer Wert für die Animationsverzögerung zugewiesen wird,  wird die Animation sofort ausgeführt. Jedoch wird sie so dargestellt, als ob sie vor dem Animationszyklus begonnen hat. Zum Beispiel, wenn Sie -1s als die Animationsverzögerungszeit angeben, wird die Animation sofort starten, allerdings 1 Sekunde innerhalb der Animationssequenz.

Falls Sie einen negativen Werk für die Animationsverzögerung angeben, der Startwert jedoch implizit ist, wird der Moment, an dem die Animation dem Element zugewiesen wird, als Startwert verwendet.

Es ist oft einfacher, die Kurzform Eigenschaft animation zu verwenden, um alle Animationseigenschaften auf einmal zu setzen.

Initialwert0s
Anwendbar aufalle Elemente, ::before und ::after Pseudoelemente
VererbtNein
Medienvisuell
Berechneter Wertwie angegeben
AnimierbarNein
Kanonische Reihenfolgedie eindeutige Reihenfolge definiert durch die formale Grammatik

Syntax

<time>#
animation-delay: 3s
animation-delay: 2s, 4ms

Werte

<time>
Der Zeitversatz von dem Zeitpunkt, an dem die Animation dem Element zugewiesen wird, nach dem die Animation starten soll. Dieser kann entweder in Sekunden angegeben werden (mittels s als Einheit) oder in Millisekunden (mittels ms als Einheit). Falls keine Einheit angegeben wird, ist der Ausdruck ungültig.

Beispiele

Siehe CSS Animationen für Beispiele.

Spezifikation

Spezifikation Status Kommentar
CSS Animations
Die Definition von 'animation-delay' in dieser Spezifikation.
Arbeitsentwurf  

Browser-Kompatibilität

Merkmal Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Grundlegende Unterstützung (Ja)-webkit 5.0 (5.0)-moz
16.0 (16.0)
10 12-o
12.10 #
4.0-webkit
Merkmal Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Grundlegende Unterstützung (Ja)-webkit 5.0 (5.0)-moz
16.0 (16.0)
? 12-o (Ja)-webkit

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

 Mitwirkende an dieser Seite: teoli, Sebastianz
 Zuletzt aktualisiert von: teoli,