Īpašība animation-duration
Īpašība animation-duration nosaka
animācijas izpildes laiku.
Sintakse
selektors {
animation-duration: laiks s vai ms;
}
Vērtības
| Vērtība | Apraksts |
|---|---|
s |
Norāda laiku sekundēs (piemēram 3s). |
ms |
Norāda laiku milisekundēs (piemēram 3ms). Viena sekunde ir 1000 milisekundes. |
Noklusējuma vērtība: 0s.
Piemērs
Šajā piemērā animācija tiks atskaņota
3 sekundes:
<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;
}
:
Skatiet arī
-
īpašība
animation-name,
kura norāda animācijas nosaukumu -
īpašība
animation-delay,
kura norāda aizkavi pirms animācijas izpildes -
īpašība
animation-timing-function,
kura norāda animācijas izpildes ātrumu -
īpašība
animation-iteration-count,
kura norāda animācijas atkārtojumu skaitu -
īpašība
animation-direction,
kura norāda animācijas virzienu -
īpašība
animation-fill-mode,
kura norāda animācijas stāvokli -
īpašība
animation-play-state,
kura ļauj apturēt animāciju -
īpašība
animation,
kas ir saīsinājums animācijām -
komanda
@keyframes,
kura norāda animācijas galvenos kadrus -
plūstošie pārejas
transition, kas ir animācija, kad novietojat kursoru virs elementa