Eienskap animation-name

Die eienskap animation-name spesifiseer die naam van die animasie (of animasies) wat op die element toegepas sal word. Die animasienaam moet dieselfde wees as die een wat gedefinieer is met die sleutelraampies-definisie @keyframes.

Sintaksis

selekteerder {
	animation-name: animasienaam;
}

Voorbeeld

In hierdie voorbeeld het die animasie die naam move:

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

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

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

Sien ook

die eienskap animation-duration,
wat die duur van die animasie spesifiseer
die eienskap animation-delay,
wat die vertraging voor die animasie begin spesifiseer
die eienskap animation-timing-function,
wat die spoed van die animasie 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 kortskrif vir animasies is
die opdrag @keyframes,
wat die sleutelraampies van die animasie definieer
gladie oorgange transition, wat animasies verteenwoordig wanneer daar oor 'n element beweeg word