not6248

I'm sorry I may have used some incorrect words. At the moment I have the fork out but haven't made any special changes. https://codepen.io/not6248/pen/WNmawWe What I want is a panel stack (in the codepen it will be written SECTION. From now on I will use the word SECTION). with behavior similar to css scroll-snap-type: y mandatory; When I move the scroll and see SECTION, it doesn't do anything. But when I scroll to SECTION 2 and others, the scroll will be moved to that SECTION like a magnet. It works similarly to the codepen name "observer vertical slides". https://codepen.io/ahmed-attia/pen/dyaKBeq But this still isn't what I want. The codepen name "observer vertical slides" feels like playing animation when scrolling. Which may not look natural on both PC and may have problems when using Mobile.

Thank you for your advice. I will improve the way I speak and ask.

This codepen works like I want. how can I pin each section one at a time? (snap) I think it might be ScrollTrigger.observe() right? I'm not sure. observer vertical slides (codepen.io)

I have section 3 section sections 1 and 3 are other contents. By section 2 there will be various steps. Follow the example in codepen. There will be a panel with various steps. The first step will stay in place and the other steps will keep stacking up. and must snap each panel Now I have used a general css position sticky to do this. And I'm still very new to Gsap. I've been searching for a way to do this for more than 3-4 days and I'm starting to get discouraged. Thank you.