Selektoren animated

Selektoren :animated vælger elementer, som i øjeblikket er involveret i en animation. Hvis du bruger en brugerdefineret jQuery-build uden effektmodulet, vil brugen af :animated forårsage en fejl. Da :animated ikke hører til CSS-specifikationen, er det for bedre ydeevne i moderne browsere bedst at filtrere elementerne først ved hjælp af en ren css-selektor og derefter anvende .filter(':animated').

Syntaks

Sådan vælger vi elementer, der er involveret i animationer:

$(':animated');

Eksempel

Lad os sørge for, at der på en af kvadraterne køres en animation ved hjælp af funktionen animateIt. Ved hvert klik på knappen med #change vil den animerede quadrats farve skifte fra grøn til rød og tilbage - ved at fjerne og tilføje klassen colored med metoden toggleClass:

<button id="change">change</button>

<div></div>
<div id="test"></div>

div {
	background: green;
	border: 1px solid #AAA;
	width: 80px;
	height: 80px;
	margin: 0 5px;
	float: left;
}
div.colored {
	background: red;
}

$('#change').click(function() {
	$('div:animated').toggleClass('colored');
});

function animateIt() {
	$('#test').slideToggle('slow', animateIt);
}

animateIt();

Se også

metoden slideToggle,
som viser skjulte elementer og skjuler viste
metoden toggleClass,
som tilføjer eller fjerner en CSS-klasse
metoden find,
som søger efter elementer inde i allerede fundne