Селектор animated

Селектор :animated бира елементе који су тренутно укључени у анимацију. Ако користите прилагођену jQuery изградњу без модула за ефекте, онда употреба :animated ће изазвати грешку. Пошто :animated не припада CSS спецификацији, онда за побољшање перформанси у модерним прегледачима боље је на почетку филтрирати елементе користећи чисти css-селектор, а затим применити .filter(':animated').

Синтакса

Овако бирамо елементе укључене у анимацији:

javascript$(':animated');

Пример

Хајде да направимо да на једном од квадрата буде покренута анимација помоћу функције animateIt. При сваком клику на дугме са #change боја анимираног квадрата ће се мењати из зелене у црвену и обрнуто - путем уклањања и додавања класе colored методом 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();

Види такође

  • метод slideToggle,
    који приказује скривене елементе и скрива приказане
  • метод toggleClass,
    који додаје или уклања CSS класу
  • метод find,
    који тражи елементе унутар већ пронађених