JSFiddle - React, Tailwind, and code Playground

by geekambassador

HTML

<script src="http://www.snorkl.tv/dev/libs/greensock/TweenMax.min.js"></script>
<script src="http://www.snorkl.tv/dev/libs/greensock/plugins/ColorPropsPlugin.min.js"></script>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>


<input type="button" id="button" value="restart()">

CSS

.box{
    background-color:#91e600;
    width:50px;
    height:50px;
    margin:10px;
    position:relative;
    -webkit-backface-visibility:hidden;
}

body{
background-color:#000;
}

JavaScript

var button = document.getElementById('button');

//use single jQuery selector to tween multiple elements
var tween = TweenLite.to($('.box'), 1, {css:{left:200, rotation:360}, ease:Back.easeOut});

button.onclick = function(){
    tween.restart();
}