tutorial pengembangan web terbaru
 

Style animationFillMode Property

<Style Object

Contoh

Mengubah properti animationFillMode dari <div> elemen:

document.getElementById("myDIV").style.animationFillMode = "forwards";
Cobalah sendiri "

Definisi dan Penggunaan

Properti animationFillMode menentukan apa gaya akan berlaku untuk elemen ketika animasi tidak bermain (when it is finished, or when it has a "delay") .

Secara default, animasi CSS tidak akan mempengaruhi elemen Anda menghidupkan sampai keyframe pertama "played" , dan kemudian berhenti mempengaruhi sekali keyframe terakhir telah selesai. Properti animationFillMode bisa mengubah perilaku ini.


Dukungan Browser

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

Nomor diikuti oleh Moz menentukan versi pertama yang bekerja dengan awalan.

Milik
animationFillMode 43.0 Tidak didukung 16.0
5.0 Moz
Tidak didukung 30.0

Sintaksis

Kembali properti animationFillMode:

object .style.animationFillMode

Mengatur properti animationFillMode:

object .style.animationFillMode="none|forwards|backwards|both|initial|inherit"

Nilai properti

Nilai Deskripsi
none nilai default. animasi tidak akan menerapkan gaya apapun untuk target sebelum atau setelah mengeksekusi
forwards Setelah ujung animasi (determined by animation-iteration-count) , animasi akan menerapkan nilai properti untuk waktu animasi berakhir
backwards animasi akan menerapkan nilai properti didefinisikan dalam keyframe yang akan mulai iterasi pertama dari animasi, selama periode didefinisikan oleh animasi-delay. Ini adalah baik nilai-nilai dari keyframe (when animation-direction is "normal" or "alternate") atau orang-orang dari ke keyframe (when animationDirection is "reverse" or "alternate-reverse")
both animasi akan mengikuti aturan untuk kedua maju dan mundur. Artinya, itu akan memperpanjang sifat animasi di kedua arah
initial Set properti ini ke nilai default. Baca tentang awal
inherit Mewarisi properti ini dari elemen induknya. Baca tentang mewarisi

Rincian teknis

Nilai default: tak satupun
Kembali Nilai: Sebuah String, yang mewakili properti animasi-fill-mode dari suatu unsur
CSS Versi CSS3

Pages terkait

Referensi CSS: animation-fill-mode property


<Style Object