Search the Community
Showing results for tags 'to()'.
Found 3 results
-
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!
-
How do I start my animation opacity from o to 1 immediately when user is scrolling down to the next section? Here in this code. The animation is using percentage of the opacity. Would like to achieve a behavior wherein when a user is scrolling at the end of the pinned section. It will Fadeoutthe previous section and then Fadein the next section. Is this achievable? If so, what's the best option to modify the code I've given? Sorry, quite new to GSAP plugin and still learning the functionalities.- 1 reply
-
- 1
-
-
- gsap
- scrolltrigger
- (and 2 more)
-
In the example codepen I have two divs overlapping each other. During the tweenLite activity the first div fades out and at the end needs to fade back in. It appears that it's opacity seems to remain at 0. In otherwords, the div with the button should reappear. Does anyone have a solution?
