:animatedS2C Home « Selectors « :animated

Positional match selector.

Shorthand version $(':animated')

Description

The :animated selector, selects all elements that are animating when the selector is run.

Being a jQuery extension the :animated pseudo selector is not part of any current CSS specification. Therefore :animated cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method.

If this selector is not preceded by another selector, the universal selector ("*") is implied and so the whole DOM will be searched. Use another selector as in the example below to narrow the search and improve performance.

Syntax


Signature Description
jQuery(':animated')Positional match

Parameters

None.

Return

N/A.

:animated Examplego to top of page Top

Selects all elements that are animating when the selector is run.

In the example below we toggle an orange background to currently animating effects.

Table For Testing Positional Selectors
Table Row 1, Table Data 1 Table Row 1, Table Data 2
Table Row 2, Table Data 1 Table Row 2, Table Data 2
Table Row 3, Table Data 1 Table Row 3, Table Data 2
Table Row 4, Table Data 1 Table Row 4, Table Data 2


$(function(){
  $('#btn1').on('click', function() {
    $("td:animated").toggleClass("orange");
  });
  function toggleOrange() {
    $(".animating").slideToggle("slow", toggleOrange);
  }
  toggleOrange();
});

Press the button below to action the above code:


go to home page Homepage go to top of page Top