CSS3 animation-timing-function

animation-timing-function :

Animasyonda bir hız eğrisi belirler.

Örnek

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
linear Animasyon baştan sona aynı hıza sahiptir.
ease Yavaş bir başlangıç ardından hızlanır ve yine yavaş bir şekilde sonlanır.
animation-timing-function Animasyonda bir hız eğrisi belirler.
ease-in Sadece başlangıç yavaştır.
ease-out Sadece bitiş yavaşlar.
ease-in-out Yavaş bir başlangıç hızlanmadan normal bir akış ardından yavaş bir son.(Yine çevirmeye bakalım)
cubic-bezier(n,n,n,n) Hızlanma ve yavaşlama noktalarını belirlersiniz.
İnital
İnherit

Tarayıcı Desteği

43.0
4.0-webkit
16.0
5.0-moz
10.0 9.0
4.0-webkit
30.0
12.0-o
15.0-webkit

“CSS3 animation-timing-function” için bir yorum

  1. animation keyframes ve transitition tamamen css’in js’den rol çalması ve gayet’de güzel oldu.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir