Search the Community
Showing results for tags 'order'.
Hello, I'm working on a rather large one page website with loads of different tweens, scrolltriggers, pins, timelines, etc. The site uses the ScrollSmoother plugin for smooth scrolling but i noticed weird behaviour when using the smooth scroll. I've included a pen to mimic the part that's causing problems When using ScrollTrigger.refresh() the order of the triggers being refreshed is different when using the ScrollSmoother. In the included pen i have 3 sections with 3 different types of animation. the order of the tweens in js is not the same as the order of the sections: 1 - normal tween with scrolltrigger - section #2 2 - timeline tween with scrolltrigger - section #3 3 - Scrolltrigger.create() - section #1 When not using the ScrollSmoother, the refresh order is: 1 - 2 -3 (as it should be) But when i enable SmoothScroller the refresh order is: 3 - 1 - 2. This messes up my triggers because 1 and 2 both have pinspacing. I've tried refreshing the timelines' scrolltrigger as mentioned here, but no success. I did manage to get it to work using refreshPriority:-1, but i don't think that's a fitting solution for me (because of the large amount of tweens/triggers/etc). So i was wondering if this is expected behavior or if i missed something or did something wrong or anything. Just trying to wrap my head around it. Any help would be highly appreciated! Cheers, Oscar
Hi, I'm having some troubles because the order of execution of callbacks and events seems different when I have nested timelines. I have reproduced a simple scenario: I have a timeline with a tween, then a call to a function that pauses the timeline, then another tween. Both tweens are "fromTo" with immediateRender = false. I have added also complete callback on the first tween and start callback on the second one in order to log them. The result is: - first tween completed - timeline paused The second tween is not starting and its start callback is not executed, as I would expect. Then, I take an identical timeline, and I nest it inside another one. In this case the result is: - first tween completed - run the callback that pauses the timeline - first frame of the second tween executed and its start callback executed - timeline actually paused So only nesting the same timeline, the behavior is different. Consider also that this happens also putting the pause action inside the complete callback of the first tween. The second tween starts in any case before the pause takes effect on the timeline. You can see it clearly in the codepen. Is there something wrong in my setup? Is there a way for having the same execution order in any nested or not nested scenario, except putting tweens and callbacks in slightly different positions? Thanks in advance
I have a few tweens as part of a TimelineMax instance that have a speed of 0. However they are executing out of sequence with the rest of the tweens, seemingly running at the very start of the timeline playback. Changing the speed to 0.1 fixes this issue. Here's a fiddle: http://jsfiddle.net/wxxkA/2/ Any ideas? Thanks