Eienskap animation-delay

Die eienskap animation-delay stel 'n vertraging voor die aanvang van die animasie in.

Sintaksis

selektor {
	animation-delay: tyd in s of ms;
}

Waardes

Waarde	Beskrywing
`s`	Spesifiseer tyd in sekondes (byvoorbeeld `3s`).
`ms`	Spesifiseer tyd in millisekondes (byvoorbeeld `3ms`). Een sekonde is `1000` millisekondes.

Verstekwaarde: 0s.

Voorbeeld

In hierdie voorbeeld sal daar 'n vertraging van 3 sekondes wees voor die animasie begin:

<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;
}

Sien ook

die eienskap animation-name,
wat die naam van die animasie spesifiseer
die eienskap animation-duration,
wat die tydsduur van die animasie spesifiseer
die eienskap animation-timing-function,
wat die spoed van die animasie-uitvoering spesifiseer
die eienskap animation-iteration-count,
wat die aantal herhalings van die animasie spesifiseer
die eienskap animation-direction,
wat die rigting van die animasie spesifiseer
die eienskap animation-fill-mode,
wat die toestand van die animasie spesifiseer
die eienskap animation-play-state,
wat toelaat om die animasie te onderbreek
die eienskap animation,
wat 'n kortnotasie vir animasies is
die opdrag @keyframes,
wat die sleutelframe van die animasie spesifiseer
gladde oorgange transition, wat 'n animasie is wanneer daar oor 'n element beweeg word