Уласцівасць 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
, якія з'яўляюцца анімацыяй па навядзенні на элемент