JosieLearnin

Hello ! Thank you so much for your answers, Im so sorry i didnt get your answer notification @GreenSock and was working hard by my side to get and post a well updated answer / situation to @Cassie and her very didactic and helpfull proposition 💚 I was still lost (and checked my mail to find back that post and saw the notifications !) but learned quite a lot about GSAP since In any case thank you so much that's exacly what i was looking for !! Just for science, what would you have used in the case where the main expectations would be both, that smooth flip action, but with a scrub true and the ability to go backward and forward ? A million thanks to you both for your help, can wait to keep progressing with GSAP 🌱

I managed to do this with OnEnter / OnLeave https://codepen.io/josielearnin/pen/GReoOpa But I still have few issues... Why does my container not pin to the top during the animation ? And it seems that when the page loads, it loads in row, then goes to column, then to row on scroll, but i guess its an issue with my toggle function, but changing it makes the animation crash... (and it still would be perfect if my "virtual play head" could follow the advance of my scroll, like 10% scroll, 10% animation played) Also maybe there is a better way because I know we are not suppose to use Tween method anymore 🙈 (old topics helped) Again, thank you so much for your time J

Thank you so much for answering, its already way way better ! In an ideal coding world I would love to be able to control text movement proportionally to scroll, like the animation would be complete when end reaches scroller-end but in the mean time movement can stop and scrolling back we could have it back to column At some scroll point the user could stop for example in the position in the screenshot (not ver aesthetic at the moment, I admit) if he stops scrolling. This example is a very good illustration of the scroll dynamics I would want to reach https://codepen.io/GreenSock/pen/bGxOjeP Should I change my appendChild method and go back to, according to this example, for example onLeave: () => { intro.classList.add("row"); intro.classList.remove("column"); }, (with the according classes declared) Or is there a way to do it with the method I already have (appendChild) Thank you again, J

Hello, Im new here, glad to enter the GSAP community I have an issue that Im trying to fix since quite a white, The idea would be to have a flex box, flex-direction column (with a certain font-size) that flips to flex-direction row (with new font size) on scroll, for now I use the appendChild method but im not sure its the best... Also the animation make the text go out of the viewport while its suppose to be sticky (header to be) and, the cherry on the cake, I would like it to be working with the scroll, I found an example here https://codepen.io/scottnj/pen/vYppeBE?editors=0010 but i cant figure it out with my work, as I said, new to GSAP.. Thanks a lot to anyone who could have an idea on how to make it work smoothly, that would be wonderful, excuses in advance, if I didnt post in the right section or the right way Have a great day, Josie