Contoh
Mengubah properti animationTimingFunction dari <div> elemen:
document.getElementById("myDIV").style.animationTimingFunction = "linear";
Cobalah sendiri " Definisi dan Penggunaan
animationTimingFunction menentukan kurva kecepatan animasi.
Kurva kecepatan mendefinisikan WAKTU animasi menggunakan untuk mengubah dari satu set gaya CSS yang lain.
Kurva kecepatan digunakan untuk membuat perubahan lancar.
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 | |||||
|---|---|---|---|---|---|
| animationTimingFunction | 43.0 | Tidak didukung | 16.0 5.0 Moz | Tidak didukung | 30.0 |
Sintaksis
Kembali properti animationTimingFunction:
object .style.animationTimingFunction Mengatur properti animationTimingFunction:
object .style.animationTimingFunction="linear|ease|ease-in|ease-out|cubic-bezier( Nilai properti Nilai Deskripsi linear animasi memiliki kecepatan yang sama dari awal sampai akhir ease nilai default. animasi memiliki awal yang lambat, kemudian cepat, sebelum berakhir perlahan ease-in animasi memiliki awal yang lambat ease-out animasi memiliki ujung yang lambat ease-in-out animasi memiliki kedua awal yang lambat dan ujung yang lambat cubic- bezier( n , n , n , n ) Tentukan nilai-nilai Anda sendiri dalam fungsi kubik-bezier
Nilai yang mungkin adalah nilai numerik dari 0 ke 1 initial Set properti ini ke nilai default. Baca tentang awal inherit Mewarisi properti ini dari elemen induknya. Baca tentang mewarisi
Rincian teknis
Nilai default: meredakan Kembali Nilai: Sebuah String, yang mewakili properti animasi-waktu-fungsi elemen CSS Versi CSS3
Pages terkait
Referensi CSS: animation-timing-function property
<Style Object