Greensock - tween basic

by Dillybob

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>
<div style="left: 0px;" id="logo" class="logo"></div>
<button aria-disabled="false" role="button" id="btn"><span>tween</span>

</button>

CSS

body {
      background-color:#000;
  }
  .logo {
      position: relative;
      background: url('http://lorempixel.com/100/100/') no-repeat scroll 0% 0% transparent;
      height:100px;
      width: 100px;
  }

JavaScript

$('#btn').on('click', function () {
    //alert('clicked');
    var logo = document.getElementById("logo");
    
    // TweenLite.to(logo, 1, {left: "632px"});

    //(element, duration, {move x px, tweet type})
    TweenLite.to(logo, 0.5,{left:"240px", ease:Cubic.easeOut });

    

});