// Question with Answer // How can I animate and rotation this code?

by Alexander Lashchevsky

HTML

<div class="block block-1"></div>
<div class="block block-2"></div>
<div class="block block-3"></div>

CSS

.block-1 {background: red;}
.block-1.active {height: 100px;}
.block-2 {background: green;}
.block-2.active {height: 100px;}
.block-3 {background: blue;}
.block-3.active {height: 100px;}

.block-1.active {transition: height .5s linear;}
.block-2.active {transition: height .5s linear; transition-delay: .5s;}
.block-3.active {transition: height .5s linear; transition-delay: 1s;}
.block {transition: height 0s linear;}

JavaScript

function animation() {
    $('.block-1').addClass('active');
    $('.block-2').addClass('active');
    $('.block-3').addClass('active');
    setTimeout(function() {
        $('.block-1, .block-2, .block-3').removeClass('active');
    }, 1500);
}

animation();

setInterval(function() {
    animation();
}, 2000);