Atribut transition-property CSS

Definisi dan penggunaan

transition-property atribut menentukan nama atribut CSS yang akan digunakan untuk efek transisi. (Efek transisi akan dimulai saat atribut CSS yang ditentukan berubah).

Petunjuk:Efek transisi biasanya terjadi saat pengguna membuang penanda mouse ke elemen.

Komentar:Selalu atur transition-duration Jika atribut tidak diset, maka waktu transisi 0, efek transisi tidak akan muncul.

Lihat pula:

Panduan CSS:Transisi CSS

Panduan HTML DOM:transitionProperty Atribut

Contoh

Pindahkan penanda mouse ke elemen div, akan muncul efek transisi yang mengubah lebar elemen secara halus:

div {
  transition-property: width;
}

Coba sendiri

CSS Syntax

transition-property: none|all|property;

Nilai atribut

Nilai Deskripsi
none Tidak ada atribut yang akan mendapatkan efek transisi.
all Semua atribut akan mendapatkan efek transisi.
property Daftar atribut CSS yang digunakan untuk efek transisi, dipisahkan dengan koma.

Detil teknis

Nilai standar: all
Inheritance: no
Versi: CSS3
Syntaxa JavaScript: object.style.transitionProperty="width,height"

Dukungan browser

Angka di tabel menunjukkan versi browser pertama yang mendukung atribut ini.

Angka yang dibawa -webkit-、-moz- atau -o- menunjukkan versi pertama yang menggunakan prefix.

Chrome IE / Edge Firefox Safari Opera
26.0
4.0 -webkit-		 10.0 16.0
4.0 -moz-		 6.1
3.1 -webkit-		 12.1
10.5 -o-