Any way to do scroll magic in webflow

Design help Animations & Interactions
1

Hello
İn this page there is an scroll magic:

e26b0e0e-85bd-40d0-a3f1-834f35b7c43c
e26b0e0e-85bd-40d0-a3f1-834f35b7c43c1600×811 175 KB

is there any way to do it in webflow?

thx
turgut

Here is my public share link: LINK
(how to access public share link)

2

This should be possible with a combination of position: sticky and transforming a container with overflow: hidden using the “While scrolling in view” interaction. That should get you started, but feel free to reply with a read-only link with your project if you get stuck and I can try to help out.

3

hello mikeyevin.
i tried everything i know. but i couldnt manege.
here is the share read only link
https://preview.webflow.com/preview/project-page-monarch-mobi-41e9778b44edc?utm_medium=preview_link&utm_source=designer&utm_content=project-page-monarch-mobi-41e9778b44edc&preview=579e76529b2eeb8d90b4ca45f26a13ee&mode=preview
thks

4

So I wasn’t able to get it done exactly the way I imagined, but I was able to come up with a couple options for you in the video below. Like I mentioned in the video, I personally prefer the first version as it’s a little more dynamic, but obviously you’re free to use whichever works best and causes the least amount of headache as you test it across various devices.

I tried to make sure I covered exactly how each of these was made, but if you’d rather I whipped up a project myself for you to clone, don’t hesitate to let me know.

2 Likes
5

hello mikeyevin

Thanks a lot not just for your kind teacihng video, thx alot especially for showing me “problem solving mind and master” as 60 years old man, i would say that what we were teaching to new begginners in media were “how to have a problem solving mind” and how to be democratic in human relations. Thx you have both. :sunny: .I watched your kind and rich knowladgefull video.
I think i did first cool option. but in second option I think i missed someting.

Annotation 2020-06-10 182416
Annotation 2020-06-10 1824161765×818 240 KB

right and left divs :slight_smile:

here is project:https://preview.webflow.com/preview/project-page-monarch-mobi-41e9778b44edc?utm_medium=preview_link&utm_source=dashboard&utm_content=project-page-monarch-mobi-41e9778b44edc&preview=579e76529b2eeb8d90b4ca45f26a13ee&mode=preview
Also I thought could this problem can be solved :
first lets have sach as 3 photo which is made in phtsp with proper borders.

  1. Lets have a sider with mouse scroll after last slide, page scrolls down.
    or
    2.lets give z index to every photo and as we scroll hide and see could be used.

could one of them work?

I thank you a lot mikeyevin with hopes of learning alot from you.
Also you say" I whipped up a project myself for you to clone, don’t hesitate to let me know."
would it be possible to see and learn on them? please
best
turgut