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 id="child">GS</div>
</div>

CSS

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

    width:40px;
    height:40px;
    background-color:blue;
    color:white;
    font-size:20px;
}

JavaScript

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



TweenLite.to(box, 5, {css:{rotation:360, transformOrigin:"100px 100px"}});
TweenLite.to(child, 5, {css:{rotation:-360}});