jQuery Selector :animated

Description

jQuery Selector :animated 

$(":animated")

The :animated selector selects all elements that are currently animated.

View in separate window 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  function aniDiv(){/*from w  w  w.  j ava  2  s  .c  o m*/
    $("div:eq(0)").animate({width: "50%"}, "slow");
    $("div:eq(0)").animate({width: "100%"}, "slow", aniDiv);
  }
  aniDiv();
  $(".btn1").click(function(){
    $(":animated").css("background-color", "red");
  });
});
</script>
</head>
<body>

<button class="btn1">Change color of the animated element</button>

<div style="background:blue;">Div 1</div>
<div style="background:green;">Div 2</div>
<div style="background:yellow;">Div 3</div>

</body>
</html>



PreviousNext

Related