Својство animation-name

Својството animation-name го задава името на анимацијата (или анимациите) што ќе се применува на овој елемент. Името на анимацијата мора да биде исто како она што е зададено при дефинирање на клучните кадрови @keyframes.

Синтакса

селектор {
	animation-name: име на анимација;
}

Пример

Во овој пример анимацијата има име 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;
}

Погледнете исто така

својство animation-duration,
кое ја задава времетраењето на анимацијата
својство animation-delay,
кое ја задава одложувањето пред извршување на анимацијата
својство animation-timing-function,
кое ја задава брзината на извршување на анимацијата
својство animation-iteration-count,
кое го задава бројот на повторувања на анимацијата
својство animation-direction,
кое ја задава насоката на анимацијата
својство animation-fill-mode,
кое го задава состојбата на анимацијата
својство animation-play-state,
кое овозможува паузирање на анимацијата
својство animation,
кое претставува кратенка за анимации
команда @keyframes,
која ги задава клучните кадрови на анимацијата
мазни премини transition, кои претставуваат анимација при преминување на елементот