JSFiddle - React, Tailwind, and code Playground

by Sharanpreet Kaur

HTML

<div class="ttt1" id="ro" style="background:#98bf21;height:100px;width:200px;position:absolute;">HELLO</div>

JavaScript

var po=$(".ttt1");  
      var i = 0;
while ( i < 100 ) {
// This block will be executed 100 times.
    po.animate({top:'100px'},2000);
	    po.animate({  borderSpacing: 5 }, {
    step: function(now,fx) {
      po.css('-webkit-transform','rotate('+now+'deg)'); 
      po.css('-moz-transform','rotate('+now+'deg)');
      po.css('transform','rotate('+now+'deg)');
    },
    duration: 3000
});
	po.animate({left:'50px'},2000);
    po.animate({top:'0px'},2000);
	
	po.animate({  borderSpacing: 0 }, {
    step: function(now,fx) {
      po.css('-webkit-transform','rotate('+now+'deg)'); 
      po.css('-moz-transform','rotate('+now+'deg)');
      po.css('transform','rotate('+now+'deg)');
    },
    duration: 3000
});
	po.animate({left:'0px'},2000);
	
i++; // Increment i
}