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:

javascript$(':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:

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

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

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

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

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

animateIt();

Se også