CSS transition-delay Özelliği

CSS transition-delay

Css transition-delay özelliği ile css animasyonlarının gecikme süresi belirlenebilir.

Örnek:

Bu örnekte genişliği 90px olan bir div elemanının genişliği6 saniyede 360px olacaktır. Fakat transition-delay: 3s; değeri verildiği için 3 saniye gecikmeli başlayacaktır.

div {
width: 90px;
height: 90px;
background: yellow;
border: 1px solid black;
-webkit-transition-property: width;
-webkit-transition-duration: 6s;
-webkit-transition-delay: 3s;
transition-property: width;
transition-duration: 6s;
transition-delay: 3s;
overflow;
auto;
}

div:hover {
width: 360px;
}

CSS transition-delay nedir nasıl kullanılır

Css ile oluşturulan animasyonların gecikme süresi bu özellik ile tanımlanabilir.

CSS transition-delay CSS transition-delay özellikleri  
Varsayılan Değer: 0s  
Kalıtsallık: yok  
Animasyon Özelliği: yok  
Versiyon: CSS3  
JavaScript transition-delay: oobject.style.transitionDelay="3s"

CSS transition-delay Tarayıcı Desteği

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

CSS transition-delay Değerleri

transition-delay: time|initial|inherit;

CSS transition-delay özelliği değerleri

CSS transition-delay değerleri CSS transition-delay değerleri tanımları
time Gecikme süresi tanımlanır saniye veya milisaniye olarak.
initial Özelliğin varsayılan değeridir.
inherit üst soybağından gelen değeri kullanır.

Yorumlar

Bu blogdaki popüler yayınlar

HTML progress Etiketi

CSS content Özelliği

HTML section Etiketi

CSS align-items özelliği

CSS justify-content Özelliği

CSS text-justify Özelliği

CSS overflow Özelliği

HTML5 Canvas Oyun Yapımı Dersleri

CSS top Özelliği