Īpašība animation-timing-function

Īpašība animation-timing-function nosaka animācijas izmaiņu ātrumu (paātrinājumu). Piemēram, sākumā lēni, tad ātri, beigās atkal lēni utt.

Sintakse

selektors {
	animation-timing-function: vērtība;
}

Vērtība	Apraksts
`ease`	Sākumā lēni, tad ātri, beigās atkal lēni.
`ease-in`	Sākas lēni un pakāpeniski paātrinās.
`ease-out`	Sākas ātri un pakāpeniski apstājas.
`ease-in-out`	Sākumā lēni, tad ātri, beigās atkal lēni. Atšķiras no ease pēc ātruma.
`linear`	Vienmēr viens un tas pats ātrums.
`step-start`	Nav animācijas, īpašība uzreiz pieņem galīgo vērtību.
`step-end`	Nav animācijas, īpašība gaida laiku, kas norādīts `animation-duraton`, un tad acumirklī pieņem galīgo vērtību.
`steps`	Īpašības vērtība mainās ar lēcieniem.
`cubic-bezier`	Bezier līkne, kas var norādīt patvaļīgu animāciju. Skat. Bezier līkņu ģeneratoru.

Noklusējuma vērtība: ease.

Novietojiet peles kursoru uz zemāk redzamajiem blokiem, lai redzētu visu laika funkciju veidu darbību:

īpašība animation,
kas ir saīsinājuma īpašība animācijām
komanda @keyframes,
kas norāda animācijas galvenos kadrus
gludas pārejas transition, kas ir animācija, kad novieto kursoru virs elementa