4

I'm trying to get scrollmagic to trigger a TweenMax animation, but the animation starts without waiting for the scroll trigger to be hit. Am I missing something here?

$(document).ready(function($) {
  var controller = new ScrollMagic();

  var tween = TweenMax.to('.animateme', 1, {color: "green", scale: 2.5});

  var scene = new ScrollScene({triggerElement: '.trigger'})
    .setTween(tween)
    .addTo(controller);
  scene.addIndicators({zindex: 100});
});
jshou
  • 672
  • 4
  • 19

1 Answers1

9

It turns out, if you must include ScrollMagic AFTER including TweenMax, otherwise the tween animation will just run and ignore scrolling.

jshou
  • 672
  • 4
  • 19
  • Yes, this is because TweenMax is a dependency of ScrollMagic. You wouldn't include your jQuery plugin before jQuery, would you? The console should tell you about this though.... – Jan Paepke Nov 06 '14 at 10:09
  • Yes, I realize this now, but it took me a bit to figure that out. It would be helpful to see this in the console. – jshou Nov 06 '14 at 17:48
  • It also turns out you'll have to add a duration to the ScrollScene Constructor. – kernel Feb 03 '15 at 12:04