Animasiýanyň dowamlylyk häsýeti

Häsýet animation-duration animasiýany ýerine ýetirmek wagtyny belgileýär.

Sintaksis

selektor {
	animation-duration: s ýa-da ms-daky wagt;
}

Görnüşleri

Görnüşi	Düşündiriş
`s`	Wagty sekuntlarda (meselem `3s`) belgileýär.
`ms`	Wagty millisekuntlarda (meselem `3ms`) belgileýär. Bir sekunt `1000` millisekunda deňdir.

Bellenen görnüşi: 0s.

Mysal

Bu mysalda animasiýa 3 sekunt dowamynda oýnalar:

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

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

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

Şeýle-de görüň

häsýet animation-name,
animasiýanyň adyny belgileýär
häsýet animation-delay,
animasiýany ýerine ýetirmekden öň gysga wagty belgileýär
häsýet animation-timing-function,
animasiýany ýerine ýetirmek tizligini belgileýär
häsýet animation-iteration-count,
animasiýanyň iterasiýa sanyny belgileýär
häsýet animation-direction,
animasiýanyň ugruny belgileýär
häsýet animation-fill-mode,
animasiýanyň ýagdaýyny belgileýär
häsýet animation-play-state,
animasiýany pauza etmäge mümkinçilik berýär
häsýet animation,
animasiýalar üçin gysgaça görnüşi
buyruk @keyframes,
animasiýanyň açar kadrlaryny belgileýär
meýletin geçişler transition, elementiň üstüne gelende animasiýa görkezýär