youngpadawan

Wow thanks, this is really great!

Okay, I discovered that this way of horizontal scrolling doesn't work in Firefox so I built it again using ScrollTrigger for the horizontal scroll, exactly like here: https://codepen.io/GreenSock/pen/YzygYvM I expected the animation of the sidebar to work with start: () => `top+=${innerWidth * 0.5} center`, etc. but it somehow doesn't. With the regular start: 'top center', and variations it's also not behaving as it should. What's the trick here?

Thank you, that's working fine!

Thanks for your help, Blake! I actually found this on CodePen when I was trying out different horizontal options and found it very interesting too. I updated the pen with one of the things that need an animation. There's a sidebar that slides open or closes by clicking it. When the last section is in the middle of the viewport, it should automatically open and then close when you scroll to the other side again. The 'top center' start worked fine for this kind of things on vertical sites I made before, but here it's somehow triggered in the first section here. What am I doing wrong?

Hello I'm currently working on a website that scrolls horizontally by using css only, exactly like in the codepen. Everything is working fine and is actually finished, but now I want to add add ScrollTrigger animations to certain elements in the sections and somehow can't get it working. Is there a way to position the markers on the x-axis and is it actually possible to use ScrollTrigger in my setup? I see a lot of examples where the horizontal scroll is done by GSAP but then the scrollbar stays on the right and the markers work fine. Thanks for your help!