Selektor animated
Selektor :animated vyberá prvky, ktoré
sú aktuálne zapojené do animácie.
Ak používate vlastnú jQuery zostavu
bez modulu efektov, tak použitie :animated
spôsobí chybu. Keďže :animated nepatrí
do CSS špecifikácie, pre zlepšenie výkonu
v moderných prehliadačoch je lepšie najprv prefiltrovať
prvky pomocou čistého css-selektora, a potom
aplikovať .filter(':animated').
Syntax
Takto vyberáme prvky zapojené do animácií:
$(':animated');
Príklad
Urobme tak, aby na jednom zo štvorcov
bola spustená animácia pomocou funkcie
animateIt. Pri každom kliknutí na tlačidlo s
#change farba animovaného štvorca sa bude
meniť zo zelenej na červenú a späť - prostredníctvom
odstránenia a pridania triedy colored metódou
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();
Pozrite tiež
-
metóda
slideToggle,
ktorá zobrazí skryté prvky a skryje zobrazené -
metóda
toggleClass,
ktorá pridá alebo odstráni CSS triedu -
metóda
find,
ktorá hľadá prvky vnútri už nájdených