Hi,
I am trying to make the hero section layout of this Shopify Theme for my Webflow site: https://cuber-theme.myshopify.com
The hero is divided in two parts, the left side is scrollable while the right side is showing images.
When the left side is scrolled, the right side follow an inverted behavior, revealing the next image from the top with some sort of slitted display.
Here are some screens from the template preview page to understand the behavior:
Initial State:
Scroll Started: left goes upward, right goes downward
Scroll continued
I love this behavior but can’t figure how to make it in Webflow. I assume there is layout trick (layers ?, position ?, etc.) and maybe some interaction (while scrolling ?).
I would really appreciate your help on this topic since it’s key in my project.
Thanks
GG !
How did you achieved that ?
Can you share the clonable project or explain the process ?
Thanks
Prepare something like this:
Can you share the project ?
I am not a pro Webflow user and seeing things in action helps me a lot (and other too).
Thanks Matthias 
Thanks mate, will have a look !
I managed to recreate the layout provided by Matthias and it works perfectly.
I only needed to make some tweaks because I am using this behavior within a section, not the entire page. I had to using the “while scrolling into view” interaction with some offset at the end to make it work.
Thanks a lot Matthias, hope it will help others !
Hi martin,
I am trying to achieve something similar.
Do you perhaps have a tutorial on how you achieved it.
Hi Matthias,
I have tried cloning your webflow project however the images are not reacting correctly.
Could you maybe assist?
