tutorial pengembangan web terbaru
 

Style animation Property

<Style Object

Contoh

Mengubah animasi dari <div> elemen, menggunakan properti singkat:

// Code for Chrome, Safari and Opera
document.getElementById("myDIV").style.WebkitAnimation = "mynewmove 4s 2";

// Standard syntax
document.getElementById("myDIV").style.animation = "mynewmove 4s 2";
Cobalah sendiri "

Definisi dan Penggunaan

Properti animasi adalah properti singkatan untuk enam sifat animasi:

animationName
animationDuration
animationTimingFunction
animationDelay
animationIterationCount
animationDirection

Note: Selalu menentukan properti animationDuration, jika durasi adalah 0, dan tidak akan pernah dimainkan.


Dukungan Browser

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung properti.

Nomor diikuti oleh WebKit, Moz, atau O tentukan versi pertama yang bekerja dengan awalan.

Milik
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-

Catatan: Chrome, Safari dan Opera mendukung alternatif, properti WebkitAnimation.


Sintaksis

Kembali properti animasi:

object .style.animation

Mengatur properti animasi:

object .style.animation=" Nilai properti
Nilai Deskripsi
animationName Menentukan nama keyframe yang Anda ingin mengikat pemilih
animationDuration Menentukan berapa detik atau milidetik animasi diperlukan untuk menyelesaikan
animationTimingFunction Menentukan kurva kecepatan animasi
animationDelay Menentukan penundaan sebelum animasi akan mulai
animationIterationCount Menentukan berapa kali animasi harus dimainkan
animationDirection Menentukan apakah atau tidak animasi harus bermain secara terbalik pada siklus alternatif
animationFillMode Menentukan nilai-nilai apa yang diterapkan oleh animasi luar waktu yang mengeksekusi
animationPlayState Menentukan apakah animasi sedang berjalan atau berhenti
initial Set properti ini ke nilai default. Baca tentang awal
inherit Mewarisi properti ini dari elemen induknya. Baca tentang mewarisi

Rincian teknis

Nilai default: none 0 kemudahan 0 1 yang normal tidak berjalan
Kembali Nilai: Sebuah String, yang mewakili properti animasi dari elemen
CSS Versi CSS3

Pages terkait

Referensi CSS: animation property


<Style Object