Home >>jQuery Tutorial >jQuery :animated Selector

jQuery :animated Selector

jQuery :animated Selector

jQuery :animated selector in jQuery is used to selects all elements that are currently animated.

Syntax:
$(":animated")
Here is an Example of jQuery :animated Selector:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script> 
$(document).ready(function(){
function aniDiv(){
$("div:eq(0)").animate({width: "50%"}, "slow");
$("div:eq(0)").animate({width: "100%"}, "slow", aniDiv);
}
aniDiv();
$(".btn1").click(function(){
$(":animated").css("background-color", "#e3129d");
});
});
</script>
</head>
<body>
<div style="background:#34ebe8;">Div 1</div><br>
<div style="background:#327ae6;">Div 2</div><br>
<div style="background:#a533de;">Div 3</div>
<br>
<button class="btn1">click me to change color of the animated element</button>
</body>
</html>

Output:
Div 1

Div 2

Div 3