bntratox

https://codepen.io/akapowl/pen/vYdjePm Hello, I want to achieve same snapping & heavy/smooth scrolling effects on this example without the scroolsmoother library, is that possible? (I want it only on the center black div, not on the whole page)

Thank you but I'm a bit short on time to learn it from scratch. Im trying to figure out how to do that by examples. https://codepen.io/joelau71/pen/zYaojeO This is similar, i forked this and converted into this: https://codepen.io/mertcanuslu/pen/xxzmOGa this would work for me. but can you tell me how can I make the left side stick/snap to top when it gets near? And can I make it a bit slow scrolling? I mean when I scroll I want it to scroll slowly with ease and when the "Test 1" "Test 2" etc. div comes near to top it will stick and pin to top automatically with ease. edit: btw if the left side would come to screen as like the right side from bottom to top it would be awesome.

Thank you for your comment, I've sent the codepen above as an example Basically: When user enters the "slider" div yellow will go top, orange go down. But at the same time, this row will disappear by sliding and new row (red and blue) will appear at the same time one coming from down one coming from above.

https://codepen.io/mertcanuslu/pen/KKebVMG This is the sample template I want to use GSAP but I don't know gsap enough to use it to make it slide. So I just created the template. I want to have a slider which triggers by scroll and when user enters the ".slider" div left div slides to top, right div slides to bottom, and then and then.. When there is no ".slide" div left to slide, it can go to the footer.

Hello, Im totally noob here so sorry I won't be able to share my codepen because I don't know gsap enough to create one for my own. I've tried everything I saw on codepen but couldn't be able to do this. In the end I found myself creating an account here. The thing I want to achieve is as you can see on the image I have a header and a footer, between them I have a sliding div section. The thing I want is when user scrolls to the middle section, the top pins to top of the screen and this green and yellow divs starts to slide but in different ways. One goes top and the other one goes down. And the new ones meet in the center. The sliding must be smooth and the new divs must stick to the top again till the person scrolls again. And then when there is no divs left in the center, user can go to the footer. I think its just easy https://codepen.io/GreenSock/pen/KKpLdWW I feel like all I have to do is do this demo in two seperate divs but even tho I've tried I couldn't make it. How can I do this please I need some help :/