Google ve Youtube Reklamlarını Engelleyen Tarayıcı ve Uygulama İndir

CSS transition Özelliği

CSS transition

Css transition özelliği ile bir animasyonun veya bir css etkisinin gerçekleşme süresi ,gecikme süresi ne kadar süreceği düzenlenebilir.

Örnek:

Bu örnekte bir div elemanının genişliği 90px'ten 360px olması 3 saniyede gerçekleşmiştir.

div { width: 90px; height: 90px; color: white; background: crimson; transition: width 3s; -webkit-transition: width 3s; /* Safari 3.1 to 6.0 */ } div:hover { width: 360px; }

CSS transition nedir nasıl kullanılır

Css transition özelliği ile html elemanlarına uygulanacak olan css etkilerinin geçiş süresi tanımlanabilir.
CSS transition CSS transition özellikleri  
Varsayılan Değer: all 0s ease 0s  
Kalıtsallık: yok  
Animasyon Özelliği: yok  
Versiyon: CSS3  
JavaScript transition: object.style.transition="all 5s"

CSS transition Tarayıcı Desteği

Aşağıdaki tablodaki sayılar özelliği destekleyen ilk tarayıcı versiyonlarını göstermektedir.

CSS Kodu:
transition 26.0
4.0 -webkit-
10.0 16.0
4.0 -moz-
6.1
3.1 -webkit-
12.1
10.5 -o-

CSS transition Değerleri

transition:property duration timing-function delay|initial|inherit;

CSS transition özelliği değerleri

CSS transition değerleri CSS transition değerleri tanımları
transition-property Geçiş efekti için CSS özelliği adını belirtir
transition-duration Geçiş efekti tamamlamak için gereken kaç saniye veya milisaniye belirler
transition-timing-function Geçiş etkisinin hız eğrisini belirler
transition-delay Geçiş efekti ne zaman başlayacağı tanımlar,yani gecikme süresidir.
initial Özelliğin varsayılan değerdir.
inherit Kalıtsal olarak aldığı değerdir.

Yorumlar