3D layered effect on interactions 2.0

Design help General
1

Hey there, I’m currently having issues recreate this effect in Webflow. I’m working with the this tutorial : https://www.youtube.com/watch?v=L949upNvp8A but the video uses legacy interactions

I’m currently using while scrolling in view interaction on a section, you can see my page here : https://preview.webflow.com/preview/newbook-homepage?preview=e5591b038bd934d87f3c7d6a1842248f

it’s on page titled : Animation Practice, section: D iso

My current issue is that the objects don’t appear to move on the z-axis when my animation reaches 100% key frame. if you guys have time, can you help me figure this one out.

05
051592×891 89.5 KB
13
132018×679 93.2 KB

2

We just posted a related tutorial here: Rotational parallax on hover - Webflow interactions and animations tutorial - YouTube

Does that help?

3 Likes
3

it helped a bit, I believe I was able to stage my component better, I still can achieve this layered effect however.

I’m currently adjusting the distance on the z-axis and the div blocks just seem to spread on the x & y axis, instead of move on the z-axis