JSFiddle - React, Tailwind, and code Playground

by reine_rizmut

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.2/plugins/CSSPlugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.2/easing/EasePack.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.2/TweenLite.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.2/TweenMax.min.js"></script>
<img id="logo" src="http://images.all-free-download.com/images/graphicthumb/tulip_flower_illustration_6814499.jpg">
<br>
<input type="button" id="restartBtn" value="restart...">

CSS

#logo {
  position: relative;
  background-color: #e3ead9;
  width: 70px;
  height: 70px;
}

JavaScript

var logo = document.getElementById("logo"),
  restartBtn = document.getElementById("restartBtn"),
tween = TweenLite.to(logo, 1, {
  left: "500px"
});

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