Omadus animation-timing-function

Omadus animation-timing-function määrab animatsiooni muutumise kiiruse (kiirenduse). Näiteks kõigepealt aeglaselt, siis kiiresti, seejärel jälle aeglaselt jne.

Süntaks

valija {
	animation-timing-function: väärtus;
}

Väärtused

Väärtus	Kirjeldus
`ease`	Kõigepealt aeglaselt, siis kiiresti, lõpus jälle aeglaselt.
`ease-in`	Algab aeglaselt ja kiireneb järk-järgult.
`ease-out`	Algab kiiresti ja aeglustub järk-järgult.
`ease-in-out`	Kõigepealt aeglaselt, siis kiiresti, lõpus jälle aeglaselt. Erineb ease'ist kiiruse poolest.
`linear`	Alati sama kiirusega.
`step-start`	Animatsiooni pole, omadus võtab kohe lõpliku väärtuse.
`step-end`	Animatsiooni pole, omadus ootab aja, määratud `animation-duraton`'is, ning võtab seejärel koheselt lõpliku väärtuse.
`steps`	Omaduse väärtus muutub hüpetena.
`cubic-bezier`	Bezier'i kõver, mis võib määrata suvalise animatsiooni. Vaata Bezier'i kõverate generaatorit.

Vaikeväärtus: ease.

Erinevate väärtuste võrdlus

Hõjuta hiirt allpool olevate plokkide kohal, et näha kõigi ajafunktsioonide tüüpide tööd:

Vaata ka

omadus animation,
mis on animatsioonide lühendatud omadus
käsku @keyframes,
mis määrab animatsiooni võtmeraamid
sujuvad ülemineked transition, mis kujutavad endast elemendi peale hõljutamise animatsiooni