JSFiddle - React, Tailwind, and code Playground

by Trần Ngọc Minh

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<button class="btn1">Thay đổi màu hiệu ứng động</button>

<div style="background:blue;">Div 1</div>

<div style="background:green;">Div 2</div>

<div style="background:yellow;">Div 3</div>

JavaScript

$(document).ready(function(){
 function aniDiv(){

     // dùng phương thức animate tạo hiệu ứng động cho Div 1

        $("div:eq(0)").animate({width: "50%"}, "slow");

        $("div:eq(0)").animate({width: "100%"}, "slow", aniDiv);

    }

    aniDiv();

    $(".btn1").click(function(){

     // thay đổi màu khi nhấn button bằng :animated

        $(":animated").css("background-color", "red");

    });
});