Hi everyone!
Can someone break down how this template achieves its horizontal scroll effect? I understand the basics of horizontal scrolling from online tutorials, but I really like how this one pauses first, then begins scrolling, and smoothly transitions to the next section of the page once the last image is displayed.
When I open the template in Readymag, I see the pages are split, but I’m struggling to fully understand how the effect works and how to replicate it. If anyone has insights, I’d really appreciate the help!
Link to template: https://readymag.com/designs/stolenhearts/
1 Like
Hello! The images are animated to move on scroll, grouped, and fixed on the screen. You don’t need to start from scratch; just ungroup them and replace the images with your own.
We also offer presets—pre-built compositions of widgets and animations. You can find the same effect in the animated widgets, then simply paste it into your project and swap the images.
This tutorial might also be helpful. Feel free to email us at support@readymag.com if you have any follow-up questions. 
1 Like
I tried to do something similar with my project cause I saw it here: ITER MORA but after selecting the horizontal scroll widget template available on the preset page, I changed the default pictures from birds to my pictures, resize then, apply delay and fix them to the screen, then when I preview, they just stay on screen while every section is beneath them so I decided to send the horizontal scroll widget to the back and make other sections above, from that moment on, I can’t see my scroll bar again and anytime I scroll through other sections before the horizontal section, I keep seeing the horizontal widget remains in the space for scroll bar.
I attached a snippet of my website footer showing where the widget remain is showing instead of scroll bar
