Örnek
A animationTimingFunction özelliğinin değiştirilmesi <div> elemanı:
document.getElementById("myDIV").style.animationTimingFunction = "linear";
Kendin dene " Tanımı ve Kullanımı
animationTimingFunction animasyon hız eğrisi belirtir.
hız eğrisi, bir animasyon bir CSS stilleri bir kümesinden değiştirmek için kullandığı saat tanımlar.
hız eğrisi düzgün değişiklik yapmak için kullanılır.
Tarayıcı Desteği
Tablodaki rakamlar tam özelliğini destekleyen ilk tarayıcı sürümü belirtin.
Moz ardından Numaraları önek ile çalıştı ilk sürümü belirtin.
| özellik | |||||
|---|---|---|---|---|---|
| animationTimingFunction | 43.0 | Desteklenmiyor | 16.0 5.0 Moz | Desteklenmiyor | 30.0 |
Sözdizimi
animationTimingFunction özelliğini Dönüş:
object .style.animationTimingFunction animationTimingFunction özelliğini ayarlayın:
object .style.animationTimingFunction="linear|ease|ease-in|ease-out|cubic-bezier( Mülkiyet Değerler değer Açıklama linear Animasyon baştan sona aynı hıza sahiptir ease Varsayılan değer. yavaş yavaş sona ermeden animasyon, ardından hızlı, yavaş bir başlangıç vardır ease-in animasyon yavaş bir başlangıç vardır ease-out Animasyon yavaş ucu ease-in-out Animasyon yavaş bir başlangıç ve yavaş ucu hem de sahiptir cubic- bezier( n , n , n , n ) kübik bezier işlevinde kendi değerlerinizi tanımlayın
Olası değerler 0 ile 1 arasında sayısal değerlerdir initial varsayılan değerine bu özelliği ayarlar. İlk hakkında okuyun inherit üst öğesinden bu özelliği devralır. Yaklaşık miras oku
Teknik detaylar
Varsayılan değer: kolaylaştırmak Geri dönüş değeri: bir elemanın animasyon-zamanlama işlevi özelliğini temsil eden bir String, CSS Sürüm CSS3
İlgili Sayfalar
CSS referans: animation-timing-function property
<Stil Nesne