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 тегіс өтулер, элементтің үстіне апару кезіндегі анимацияны білдіреді