Parallax animation lasting from onEnter until onLeave #626

Open
fredconv opened this Issue Dec 5, 2016 · 0 comments

Projects

None yet

1 participant

@fredconv
fredconv commented Dec 5, 2016

Hello

Thanks to scrollMagic, i was able to create a parallax effect for some background images.
But my background parallax animation only last until my section is completly visible

var section_bg_ctrl = new ScrollMagic.Controller();
var bg_TL = new TimelineMax();
bg_TL
  .from('#parallax .bg', 1, {y: '-40%', ease: Linear.easeNone});
var section1_bg = new ScrollMagic.Scene({
  triggerElement: '.parallax--2',
  triggerHook: 1,
  duration: '100%'
})
  .setTween(bg_TL)
  .addTo(section_bg_ctrl_in);

So here as soon as my parallax section enter the viewport, the tween is triggered.

But how can i make it last until my section is outside the viewport (leaving by the top) and not fully visible ? should i modify the triggerHook with something specific ? or create another Scene and calling a second tween just to handle the leaving of my section ?

and what about performance ?

thanks for your help

@fredconv fredconv changed the title from duration from onEnter until onLeave to Parallax animation lasting from onEnter until onLeave Dec 5, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment