janpaepke / ScrollMagic

The javascript library for magical scroll interactions.
http://ScrollMagic.io
Other
14.88k stars 2.17k forks source link

hidden greensock tweens are being triggered #377

Open bonomite opened 9 years ago

bonomite commented 9 years ago

My project consists of a long page that is broken up in to 12 sections. Several Scrollmagic animations (reverse: false) are initialized on document.ready and are present in every section. All works fine, but my system reveals a section at a time. It starts with a $('.section').hide(); and as the user moves down to the end of Section 1, they can open/reveal the next section... and so on... continuing like this till they reach the last 12th part. PROBLEM is, that when a new section is revealed, the Scrollmagic tween seems to have already triggered and completed. If I set reverse:true, it works, but that is not my desired preference. How can I tell Scrollmagic to wait, or ignore the hidden sections until they are visible? Thoughts? Thanks.

bonomite commented 9 years ago

I'm currently using the jQuery lazy load plug-in Unveil to init the ScrollMagic when the lazy load starts loading the actual image... seems to work fine.

krnlde commented 9 years ago

You can try to enable or disable the scenes via ScrollMagic.Scene.enabled(boolean) but to me it sounds like a code design issue. It's not the correct way to first set some scroll based animations and then just .hide() the elements because you don't want to see them right now. The animation will still work in the background. Think about what you want to achieve and refactor your code accordingly. Remember that you can create new ScrollMagic.Scenes on demand. Maybe that's what you really want to achieve? Greetings