Својство animation-delay
Својството animation-delay поставува
одложување пред стартување на анимацијата.
Синтакса
селектор {
animation-delay: време во s или ms;
}
Вредности
| Вредност | Опис |
|---|---|
s |
Одредува време во секунди (на пример 3s). |
ms |
Одредува време во милисекунди (на пример 3ms). Една секунда е 1000 милисекунди. |
Стандардна вредност: 0s.
Пример
Во овој пример, пред почетокот на анимацијата ќе има
одложување од 3 секунди:
<div id="elem"></div>
@keyframes move {
from {
margin-left: 0;
}
to {
margin-left: 400px;
}
}
#elem {
animation-delay: 3s;
animation-duration: 6s;
animation-name: move;
animation-iteration-count: infinite;
animation-timing-function: linear;
border: 1px solid black;
width: 50px;
height: 50px;
}
:
Погледнете ги и
-
својството
animation-name,
кое го задава името на анимацијата -
својството
animation-duration,
кое ја задава времетраењето на анимацијата -
својството
animation-timing-function,
кое ја задава брзината на извршување на анимацијата -
својството
animation-iteration-count,
кое го задава бројот на повторувања на анимацијата -
својството
animation-direction,
кое ја задава насоката на анимацијата -
својството
animation-fill-mode,
кое го задава состојбата на анимацијата -
својството
animation-play-state,
кое овозможува паузирање на анимацијата -
својството
animation,
кое претставува кратенка за анимациите -
командата
@keyframes,
која ги задава клучните кадрови на анимацијата -
мазните премини
transition, кои претставуваат анимација при лебдење над елемент