JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.greensock.com/js/src/TweenMax.min.js"></script>
click the box once it starts pulsing
<div id="boxHolder">
  <div id="box"></div>
</div>

CSS

#box {
  position:relative;
  width:50px;
  height:50px;
  background-color:red;
  visibility:hidden;
}

JavaScript

var box = $("#box"),
  boxHolder = $("#boxHolder"),
  fadePulse,
  movement;

movement = TweenMax.fromTo(box, 2, {
  css: {
    left: 0,
    autoAlpha: 0
  }
}, {
  css: {
    left: 300,
    autoAlpha: 1
  },
  onComplete: function () {
    fadePulse.restart()
  }
})



fadePulse = TweenMax.to(boxHolder, 1, {
  css: {
    opacity: 0
  },
  repeat: -1,
  yoyo: true,
  paused: true
});


box.click(function () {
  movement.reverse();
  fadePulse.pause();
  //set the pulsing tween's target back to a fully visible state at time(0)
  TweenLite.to(fadePulse, fadePulse.time(), {time:0});
})