<div class="box box1 green"></div>
<div class="box box2 orange"></div>
<div class="box box3 grey"></div>
/* Global styles come from external css https://codepen.io/GreenSock/pen/JGaKdQ*/

body {
  margin: 10px;
}

.box {
  display: block;
}

.pink {
  background-color: pink;
}
var tl = gsap.timeline();
//sequenced one-after-the-other
tl.to(".box1", {duration: 2, x: 100}) //notice that there's no semicolon!
  .to(".box2", {duration: 1, y: 200})
  .to(".box3", {duration: 3, rotation: 360});

External CSS

  1. https://codepen.io/GreenSock/pen/JGaKdQ.css

External JavaScript

  1. https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/gsap-latest-beta.min.js