sandy120

Hi @Rodrigo, Anyway, thanks for your helps. I adapted my JS code, but it still has Safari flashing bug... I can't resolved the problem at last.

Hi @GreenSock, I,ve already revise my code according to your advice. But on Safari and Safari Mobile it still flashes towards the end of each one of the animations in the timeline. Is it possible to achieve all these conditions by GSAP ScrollTrigger： 1. I want the GSAP animation play only one time when scroll down, and not to replay animation when scroll back up. So I used ScrollTrigger.refresh() in onLeave function. 2. I need the pin: true setting to achieve the animation effect I want. 3. No flashing bug on Safari and Safari Mobile. This is my codepen, I've simplify my JS code as much as possible： https://codepen.io/joanna_0705/pen/GRwLxYW Please tell me how to improve the code, thanks again.

Hi @GreenSock, Thanks for the quickly reply, I'll research these tips. Hope can resolved on safari flashing problem.

Hi All, I have a problem with GSAP ScrollTrigger onLeave function. First, I want the GSAP animation play only one time when scroll down, and not to replay animation when scroll back up. So I use onLeave function to disable the animation play again, and refresh ScrollTrigger to reset it. It works fine on Chrome, but on Safari and Safari Mobile(iOS) it flashes towards the end of each one of the animations in the timeline. I have no idea how to fix it on safari. If anyone could give me some advice on how to fix this and any other tips to improve the performance, i'd really appreciate. (※And I find out that when the animations timeline group amount is more, the flashing problem is more serious. ) This is my demo codepen： https://codepen.io/joanna_0705/pen/NWEoPrK

@Rodrigo Thank you so much, It was exactly what I needed.

Hello, I have some problem with GSAP. Hope can find the solution here. I want to use a scrollTrigger with {pin: true;}. Then onLeave, the animation should stop, so that when going up (onEnterBack), the animation shouldn't reverse. Then on leaveBack, I would like to re-enable the animation as at the beginning, so that scrolling down again would animate. I want to find something like this example, but also to use the setting with {pin: true;} , and I want the progress stop at (1) when onLeave. https://codepen.io/GreenSock/pen/Rwqozzx I don't know how to fix it, please help me, thanks for all good peoples here.? This is my codepen: https://codepen.io/lin-hsienli/pen/KKrvmgE

Hi @Rodrigo ~ Thanks for your help !! I will try to refer to your code.

Hello nice people of GSAP, Forgive me for poor English please.?? My mother tongue is Chinese. I'm a new user for learning how to use GSAP in my project. And now encountered some problems in using GSAP to make a horizontal scroll slider. I'm looking for methods to complete these effects below： 1. When scroll down, slider go horizontal scroll only once time. If scroll back, stop the horizontal scroll effect. 2. Add next and prev button to switch slider by pure JS. (Sorry for that I don't tend to use GSAP Club Plugins, I'm trying to complete it by open source and free ) I tried using the attribute "once: true", but the next/prev button and anchor button not working. And when scroll back this will leave white space on the top. Please tell me how to fix it, thanks for kind people.?? This is the demo I write on codepen： https://codepen.io/lin-hsienli/pen/abRGEZP