animation-duration հատկությունը
animation-duration հատկությունը սահմանում է
անիմացիայի կատարման ժամանակը:
Շարահյուսություն
ընտրիչ {
animation-duration: ժամանակը s-ով կամ ms-ով;
}
Արժեքներ
| Արժեք | Նկարագրություն |
|---|---|
s |
Սահմանում է ժամանակը վայրկյաններով (օրինակ 3s): |
ms |
Սահմանում է ժամանակը միլիվայրկյաններով (օրինակ 3ms): Մեկ վայրկյանը 1000 միլիվայրկյան է: |
Լռելյայն արժեքը՝ 0s:
Օրինակ
Այս օրինակում անիմացիան կկատարվի
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;
}
:
Տես նաև
-
animation-nameհատկությունը,
որը սահմանում է անիմացիայի անունը -
animation-delayհատկությունը,
որը սահմանում է անիմացիայի կատարման ուշացումը -
animation-timing-functionհատկությունը,
որը սահմանում է անիմացիայի կատարման արագությունը -
animation-iteration-countհատկությունը,
որը սահմանում է անիմացիայի կրկնությունների քանակը -
animation-directionհատկությունը,
որը սահմանում է անիմացիայի ուղղությունը -
animation-fill-modeհատկությունը,
որը սահմանում է անիմացիայի վիճակը -
animation-play-stateհատկությունը,
որը թույլ է տալիս դադարեցնել անիմացիան -
animationհատկությունը,
որը հանդիսանում է անիմացիաների համառոտ գրառում -
@keyframesհրամանը,
որը սահմանում է անիմացիայի հիմնական կադրերը -
transitionհարթ անցումները, որոնք հանդիսանում են անիմացիա տարրի վրա դրվելու դեպքում