Örnek
Bir animasyonunu değiştirme <div> steno özelliğini kullanarak, eleman:
// Code for Chrome, Safari and Opera
document.getElementById("myDIV").style.WebkitAnimation = "mynewmove 4s 2";
// Standard syntax
document.getElementById("myDIV").style.animation =
"mynewmove 4s 2";
Kendin dene " Tanımı ve Kullanımı
Animasyon özelliği animasyon özelliklerinin altı için kısa bir özelliktir:
animationName
animationDuration
animationTimingFunction
animationDelay
animationIterationCount
animationDirection
Note: Her zaman animationDuration özelliği belirtin aksi süresi 0'dır ve oynanacak asla.
Tarayıcı Desteği
Tablodaki rakamlar tam özelliğini destekleyen ilk tarayıcı sürümü belirtin.
Webkit, Moz, veya O izledi Numaraları önek ile çalıştı ilk sürümü belirtin.
özellik | |||||
---|---|---|---|---|---|
animation | 43.0 4,0 Webkit | 10.0 | 16.0 5.0 Moz | 4,0 Webkit | 30.0 15.0 Webkit 12.1 12.0-o- |
Not: Chrome, Safari ve Opera bir alternatif, WebkitAnimation özelliğini desteklemez.
Sözdizimi
animasyon özelliğini Dönüş:
object .style.animation
animasyon özelliğini ayarlayın:
object .style.animation=" Mülkiyet Değerler değer Açıklama animationName Eğer seçicinin bağlanma anahtar karesinin adı istiyorum belirtir animationDuration Bir animasyon tamamlamak için kaç saniye veya milisaniye belirtir
animationTimingFunction animasyon hız eğrisi belirtir animationDelay animasyon başlayacaktır önce bir gecikme belirtir
animationIterationCount Bir animasyon oynanması gerektiğini kaç kez belirtir animationDirection animasyon alternatif döngülere tersten oynaması gerektiğini olup olmadığını belirtir animationFillMode Ne değerler o çalıştırdığı süre dışında animasyon ile uygulanır belirtir animationPlayState animasyon çalışıyor veya duraklatılmış olduğunu belirtir 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: yok 0 kolaylığı 0 1, normal yok yürütülmesini Geri dönüş değeri: Bir elemanın animasyon özelliği temsil eden bir String, CSS Sürüm CSS3
İlgili Sayfalar
CSS referansı: animation property
<Stil Nesne