CSS/Eigenschaften/animation-delay

Browserunterstützung
caniuse.com

Die Eigenschaft animation-delay legt fest, mit welcher Verzögerung die Animation starten soll

Erlaubte Werte

Zeitangabe

Vererbung steuernde Werte inherit, initial, unset und revert

Standardwert

0s

anwendbar auf

alle Elemente, Pseudoelemente ::before und ::after

Vererbung

nein

animierbar

nein

Beispiel

@keyframes beispiel {
    from {background-color: #000;}
    to {background-color: #fff;}
}

aside {
    animation-name: beispiel 
    animation-duration: 3s;
    animation-delay: 2s
}

Die Animation beispiel startet nicht sofort, sondern erst nach 2 Sekunden.

Siehe auch

• 

  mehrstufige Animationen

  komplexe Abfolgen und Bewegungsmuster

  • keyframes (Wegpunkte für die Animation)
  • Dauer und Wiederholungen
   
• 

  SVG mit CSS animieren
  • Transformationen
  • Line-Drawing
  • SVG-Uhr
   

Weblinks

• Spezifikation (W3C): animation-delay
• MDN: animation-delay
• Details: caniuse.com