Animații CSS. Întârziere animație.
Partajeaza in Google Classroom
Memorator: Descriere video Descarcă PDF
Proprietatea animation-delay specifică o întârziere pentru începerea unei animații.
Următorul exemplu are o întârziere de 2 secunde înainte de a începe animația:
Exemplu:
div {
width: 100px;
height: 100px;
position: relative;
background-color: red;
animation-name: example;
animation-duration: 4s;
animation-delay: 2s;
}
De asemenea, sunt permise valori negative. Dacă utilizați valori negative, animația va începe ca și cum ar fi jucat deja N secunde.
În următorul exemplu, animația va începe ca și cum ar fi jucat deja timp de 2 secunde:
Exemplu:
div {
width: 100px;
height: 100px;
position: relative;
background-color: red;
animation-name: example;
animation-duration: 4s;
animation-delay: -2s;
}