[StaggerFrom always runs on page load not on scroll magic event]

I'll need to do more testing to confirm the issue but I think it's due to the order in which the scripts are pulled in. This seems to cause the issue:

 

    <script src="//cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.3/ScrollMagic.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/debug.addIndicators.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/animation.gsap.min.js"></script>
    <script src="js/TweenMax.min.js"></script>

While this fixes it:

 

  <script src="js/TweenMax.min.js"></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.3/ScrollMagic.min.js'></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/animation.gsap.js'></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/debug.addIndicators.min.js'></script>

[StaggerFrom always runs on page load not on scroll magic event]

Thanks - frustratingly, in my codepen this works as expected!

 

See the Pen ygdMzL by MrTG (@MrTG) on CodePen

 

In my code where this isn't working, the trigger element isn't yet in view (as I can see from the indicators) yet this still seems to fire on page load.I'll have to investigate further.

[StaggerFrom always runs on page load not on scroll magic event]

Thanks for the swift reply. I'd seen this property and assume it would be set like this:

var tween = TweenMax.staggerFrom(targetDivs, 2, { opacity: 0, immediateRender: false }, 0.5),

However, this makes no difference - the stagger still runs on pageLoad rather than waiting for the scrollmagic trigger. Is the above the correct way to implement this? 

[StaggerFrom always runs on page load not on scroll magic event]

I'm trying to get a staggerFrom animation to occur on a scrollmagic event with the following code however, the stagger always seems to happen instantly on page load rather than waiting for the scroll magic event to fire. 

 

 var tween = TweenMax.staggerFrom(targetDivs, 2, { opacity: 0 }, 0.5),
         scene = new ScrollMagic.Scene({
             triggerElement: element,
             reverse: false,
         });

        scene.setTween(tween)
        scene.addTo(this.controller)
        scene.addIndicators({ name: "staggering" });

        this.scenes.push(scene);

Using other simple tweens like this work as expected without any issues:

var tween = TweenMax.from(element, .75, { opacity: 0, x: -40 })

Is there anything specific about 'staggerFrom' which would stop this from working?