ChildDev

Hi, Thank you very much for your reply. In fact, after reading this page of your documentation position-parameter, I understood how to use gsap timeline correctly, which enabled me to achieve the effect I wanted. Here is the correction I made with your help: tl.fromTo( section.querySelector(".second"), { yPercent: 100, y: 0 }, { yPercent: 0 } ) .fromTo( section.querySelector(".third"), { yPercent: 100, y: 0 }, { yPercent: 0 }, ">" ) .fromTo( section.querySelector(".second-content"), { yPercent: -100, y: 0 }, { yPercent: 0 }, 0 ) .fromTo( section.querySelector(".third-content"), { yPercent: -100, y: 0 }, { yPercent: 0 }, ">" ); Thank you very much I wish you all the best Sincerely

All right, thank you very much! Indeed, by adding a context for React, it works much better! I've got one last question, I've tried to add a third section, but it doesn't blend in like the second one and so it goes on top. Would this effect be limited to 2 sections that blend together, or is my implementation not correct? I'm sorry, I'm still at the beginner's stage when it comes to gsap, but I have to admit I love what I can do! https://codesandbox.io/s/heuristic-hooks-jlvjc8

Thank you for your answers. I understand and that's why I managed to reproduce the effect with gsap scrolltrigger using the last thread shown above. However I have a problem, when starting the trigger, my content goes relatively low, which generates me a big empty hole. You then have to scroll down and then up again to get the desired effect. Do you have any ideas about my bug? Here's the sandbox: https://codesandbox.io/s/heuristic-hooks-jlvjc8

Hello, I'm just starting to use GSAP. I'm trying to create a section comparison effect when scrolling. I have a div containing 3 rather similar sections. The aim is that, when scrolling, this div is positioned in absolute and only the sections scroll in comparison, like the image below, taken from the site: https://things.morflax.com/ After a lot of searching, I haven't found any similar examples. I hope I've made myself clear and thank you in advance for your help.