selfishound

This is incredibly helpful. Thank you very much! @Shaun Gorneau Now I am doing it all in GSAP But I do have another question for which I have another pen here: This time we have: 1. Text moves up 2. 2 blur effects follow 3. all while parallax is activated problem: I hope you can reproduce it, but it seems to 1.sometimes run a bit glitchy and jump, as if the parallax and blur might be affecting each other (i guess blur is a performance heavy calculation?); 2.sometimes the blur freezes until I scroll; 3.sometimes the last blur effect never happens, it never returns sharp. 4.the first blur effect seems to be unaffected by the ease; It must be my approach, so I a wondering if maybe there should be another timeline or something?

I have two javascript elements here: 1. The green box moves upwards and stops. - Done with GSAP TweenMax 2. The green box parallaxes as you scroll down - Done with Jquery The problem here is: when you start scrolling before GSAP is finished, the parallax doesnt work. Once the animation is over, Jquery makes the box jump into its intended parallaxed place. This can be replicated by scrolling down a bit and then wait for the animation to finish and then scroll a bit more to make jquery set in. What I want: I want them to work at the same time Thank you very much.