animation-delay Özelliği

animation-delay özelliği, animasyon başlamadan önceki gecikmeyi ayarlar.

Sözdizimi

seçici {
	animation-delay: s veya ms cinsinden süre;
}

Değerler

Değer	Açıklama
`s`	Saniye cinsinden süreyi belirtir (örneğin `3s`).
`ms`	Milisaniye cinsinden süreyi belirtir (örneğin `3ms`). Bir saniye `1000` milisaniyedir.

Varsayılan değer: 0s.

Örnek

Bu örnekte, animasyon başlamadan önce 3 saniyelik bir gecikme olacaktır:

<div id="elem"></div>

@keyframes move {
	from {
		margin-left: 0;
	}
	to {
		margin-left: 400px;
	}
}

#elem {
	animation-delay: 3s;
	animation-duration: 6s;
	animation-name: move;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	border: 1px solid black;
	width: 50px;
	height: 50px;
}

Ayrıca Bakınız

animasyonun adını belirten animation-name özelliği
animasyonun süresini belirten animation-duration özelliği
animasyonun hızını belirten animation-timing-function özelliği
animasyonun tekrar sayısını belirten animation-iteration-count özelliği
animasyonun yönünü belirten animation-direction özelliği
animasyonun durumunu belirten animation-fill-mode özelliği
animasyonu duraklatmayı sağlayan animation-play-state özelliği
animasyonlar için kısa yazım olan animation özelliği
animasyonun karelerini belirleyen @keyframes komutu
Bir öğenin üzerine gelindiğinde animasyonu temsil eden transition geçişleri