tortur33

@Cassie can you help me?

Hi Cassie, thanks a lot for your reply! I roughly typed in the code. Right now I have main blocks and sub blocks in the first main. I need to do so until the scrolling of subblocks is completed. The second big block did not appear. Now this is implemented on selected values, but I need a universal solution. I hope for your help https://codepen.io/faychaka/pen/eYVPRdj

Hi guys, tell me please, how can I fix (for scrolling) the parent block while scrolling the page while animations for adding cards occur in it? how the cards should be attached to the scroll. https://prnt.sc/eeC9wqiOLlmk https://prnt.sc/b5rXoRhw2ylP Cards should slide out from left to right, occupying a layer position. The next card should start its animation when the previous animation has ended. As a result, you need to get the following result https://prnt.sc/kM2Mre1NgwyW After that, the parent block needs to be fixed and continue scrolling the page in normal mode. Here is my not so good code const cards = document.querySelectorAll(".key-feature__box"); cards.forEach((card, index) => { gsap.to(card, { scrollTrigger: { trigger: card, start: "top center", end: "bottom top", markers: true, scrub: true, pin: ".app__page", }, x: index % 2 == 0 ? -668 : -500, y: 32 * index, }); }); what we have at the moment I really hope for your help