:animated Selector
Categories: jQuery Extensions | Basic Filter
jQuery(':animated')
Description: Select all elements that are in the progress of an animation at the time the selector is run.
-
jQuery(':animated')
version added: 1.0
Note:
Because:animated
is a jQuery extension and not part of the CSS specification, queries using :animated
cannot take advantage of the performance boost provided by the native DOM querySelectorAll()
method. To achieve the best performance when using :animated
to select elements, first select the elements using a pure CSS selector, then use .filter(":animated")
.
-
Change the color of any div that is animated.
HTML:
<button id="run">Run</button> <div></div> <div id="mover"></div> <div></div>
CSS:
div { background:yellow; border:1px solid #AAA; width:80px; height:80px; margin:0 5px; float:left; } div.colored { background:green; }
Code:
$("#run").click(function(){ $("div:animated").toggleClass("colored"); }); function animateIt() { $("#mover").slideToggle("slow", animateIt); } animateIt();