Media Query watcher

gistfile1.txt

// source: https://greensock.com/forums/topic/18719-how-to-manage-gsap-animation-in-mobile-device/

function installMediaQueryWatcher(mediaQuery, layoutChangedCallback) {
  var mql = window.matchMedia(mediaQuery);
  mql.addListener(function (e) { return layoutChangedCallback(e.matches); });
  layoutChangedCallback(mql.matches);
}

// example below
installMediaQueryWatcher("(min-width: 600px)", function(matches) {
  
  if (matches) {
    
    TweenMax.to(".red", 1, { x: 200 });
    TweenMax.to(".blue", 1, { x: 0 });
    
  } else {
    
    TweenMax.to(".red", 1, { x: 0 });
    TweenMax.to(".blue", 1, { x: 200 });
  }
});