JSFiddle - React, Tailwind, and code Playground

by geekambassador

HTML

<script src="http://www.snorkl.tv/dev/libs/greensock/TweenMax.min.js"></script>
<div id="console">click the orange box to start the animation</div>
<div id="box"></div>

CSS

#box{
    position:relative;
    width:50px;
    height:50px;
    background-color:#f60;
}

JavaScript

var box = $('#box');
var console = $('#console');

var master = new TimelineLite({paused:true, delay:2});

var child = new TimelineLite();
child.to(box, 1, {css:{left:200}})
     .to(box, 1, {css:{scale:.2}});

master.append(child);

box.click(function(){
    console.html('*** the animation will begin in 2 seconds ***');    
    master.play();
});