Selenee

Hey, @elegantseagulls thank you for this example! Looks really good. Thanks for explanation and advice @Rodrigo. It really helped me! I changed my code and tried something like that: https://codepen.io/Selenee/pen/NWLmyoX I think its the similar effect like Elegantseagulls did? (Only changed my x - changed my mind) Thank you for help ?!

Hello there This is my first program with this library so im little bit confused for now. I created a little demo showing my problem. I want to create effect that triggers on scroll and moving my headers to the center of content. This works ok, as you can see in my code. Start position should be out from left side of window and moves to center. Looks "okay" but i have a couple questions: 1. How to avoid: my header jumps on center of the content when you scroll back (it should be out from window). U can see that text moves on the left side (out of the window) and immediatley jumps on center. - it should be stay out of the window. https://greensock.com/docs/v3/GSAP/gsap.to() Have I done something wrong? Maybe because im using startAt{}? instead use fromTo? - i tried with this but had problem with working well on my class using more than 1 header. Probably it is caused because of my low experience. 2. How to slow my animation? - too agressive for now. 3. A little problem to understand syntax of ScrollTrigger start: syntax start: "trigger" "viewport" ? I want start on top of my page and end of the center. In my main code i have navigation menu and u can jump on header and center of section pressing the appropriate button (anchor). - then header has to be centered. When you scroll up header should hide himself. - a little animatin When you scroll down (out form the window header) - header should move smoothly to center. When you scroll down (from center position) - nothing. So should i use start: "center bottom",? It looks ok. But when im scrolling up im unable to see if header goes back out from the window. Maybe this is a simple answer but im tired and i'm unable to figure it out. Thanks for any help and sources!