Split Screen Scrolling Animation

Animations
1

I want to re-create the split screen animation from this site’s home page. I’m looking for the images on both the left and right to lockup in place on scroll and then the next images appear on scroll. Any tips or ideas on how to do this animation in Readymag?

I’ve been banging my head against the wall these past few weeks trying to figure this out and so far I followed the tutorial from TikTok but that didn’t make the images lock up in place with each other on scroll.

I’ve only been able to get this animation to work once - sliding from the first 2 images to the second 2 images. But I want to be able to scroll through at least 9 of these transitions (I plan on using them as thumbnails for my projects on my homepage).

I’ve tried using the stack all pages vertically feature to achieve this effect but it scrolls the whole page down from one project page to the next and I want everything to stay locked in place on the screen like in the reference.

Any and all help is appreciated. Thanks!

2

hey… lets imagine: You have some content in the left and on the right your images should scroll but the left side is fixed.

You would then just group your content on the left and fix it to the upper left corner. Then you would just place your images on the right one after the other (they are not fixed) and thats it.