animation-timing-function ගුණය
animation-timing-function ගුණය
සජීවීකරණය වෙනස්වීමේ වේගය (ත්වරණය)
සකසයි. උදාහරණයක් ලෙස, මුලින් මන්දගාමීව, පසුව
වේගයෙන්, පසුව මන්දගාමීව යනාදිය.
වාක්ය රචනා ක්රමය
තෝරන්නා {
animation-timing-function: අගය;
}
අගයන්
| අගය | විස්තරය |
|---|---|
ease |
මුලින් මන්දගාමීව, පසුව වේගයෙන්, අවසානයේ නැවත මන්දගාමීව. |
ease-in |
මන්දගාමීව ආරම්භ වී ක්රමයෙන් වේගය ලබයි. |
ease-out |
වේගයෙන් ආරම්භ වී ක්රමයෙන් නතර වේ. |
ease-in-out |
මුලින් මන්දගාමීව, පසුව වේගයෙන්, අවසානයේ නැවත මන්දගාමීව. ease වලින් වෙනස් වන්නේ වේගයෙනි. |
linear |
සෑම විටම එකම වේගය. |
step-start |
සජීවීකරණයක් නොමැත, ගුණය වහාම අවසාන අගය ගනී. |
step-end |
සජීවීකරණයක් නොමැත, ගුණය රැඳී සිටිනු ලබන්නේ කාලය,
animation-duraton හි නියම කර ඇති පරිදි,
ඉන්පසු එක් පැහැදිලි අවස්ථාවක අවසාන අගය ගනී.
|
steps |
ගුණයේ අගය පිරිවැය සහිතව වෙනස් වේ. |
cubic-bezier |
බෙසියර් වක්රය, එය අත්තනෝමතික සජීවීකරණයක් නියම කළ හැකිය. බලන්න බෙසියර් වක්ර උත්පාදකය. |
පෙරනිමි අගය: ease.
විවිධ අගයන් සංසන්දනය කිරීම
කාල කාර්යයන්ගේ සියලුම වර්ගවල ක්රියාකාරිත්වය දැක ගැනීමට, පහත දක්වා ඇති බ්ලොක් වලට මූසිකය ගෙනයන්න:
මෙයද බලන්න
-
animationගුණය,
සජීවීකරණ සඳහා කෙටි ගුණයක් ලෙස ක්රියා කරයි -
@keyframesවිධානය,
සජීවීකරණයේ යතුරු රාමු නියම කරයි -
සුමට සංක්රමණ
transition, අංගයක් මත සැරිසැරීම මත සජීවීකරණයක් නියෝජනය කරයි