Sifa ya animation-duration
Sifa animation-duration inaweka
muda wa kutekeleza animashoni.
Kisarufi
kichaguli {
animation-duration: muda katika s au ms;
}
Thamani
| Thamani | Maelezo |
|---|---|
s |
Inabainisha muda kwa sekunde (kwa mfano 3s). |
ms |
Inabainisha muda kwa milisekunde (kwa mfano 3ms). Sekunde moja ni 1000 milisekunde. |
Thamani chaguomsingi: 0s.
Mfano
Katika mfano huu, animashoni itachezwa
kwa muda wa sekunde 3:
<div id="elem"></div>
@keyframes move {
from {
margin-left: 0px;
}
to {
margin-left: 400px;
}
}
#elem {
animation-duration: 3s;
animation-name: move;
animation-iteration-count: infinite;
animation-timing-function: linear;
border: 1px solid black;
width: 50px;
height: 50px;
}
:
Angalia pia
-
sifa
animation-name,
inayobainisha jina la animashoni -
sifa
animation-delay,
inayobainisha kucheleweshwa kabla ya kutekeleza animashoni -
sifa
animation-timing-function,
inayobainisha kasi ya kutekeleza animashoni -
sifa
animation-iteration-count,
inayobainisha idadi ya marudio ya animashoni -
sifa
animation-direction,
inayobainisha mwelekeo wa animashoni -
sifa
animation-fill-mode,
inayobainisha hali ya animashoni -
sifa
animation-play-state,
inayoruhusu kusimamisha animashoni kwa muda -
sifa
animation,
inayowakilisha kifupi cha animashoni -
amri
@keyframes,
inayobainisha muafaka muhimu ya animashoni -
miendo laini
transition, inayowakilisha animashoni inapoelekezwa kwenye kipengele