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

Popüler yayınlar

CSS justify-content Özelliği

HTML Yorumlar

CSS content Özelliği

CSS align-items özelliği

CSS text-decoration Özelliği

CSS flex-basis Özelliği

CSS text-align Özelliği

CSS background-repeat Özelliği

Javascript ile neler yapılabilir

CSS border-bottom Özelliği