Hi I’m looking to imitate this scroll interaction here where as you scroll the image on the left continues but the information on the right stays fixed/static. Wondering how to recreate this. Thanks!
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
Hi,
Your read only link is incorrect, please could you repost it?
Hi I added my read-only link. I don’t really have this page up yet where I would use this interaction
This is done with position: sticky and you can take a look at Webflow’s tutorial on getting it implemented here. Let us know if you have any issues!
@mikeyevin is exactly right. The wonderful team at Webflow has made it super easy to create sticky sections on your site. That said, it’s inherently confusing until you’ve done it a few times.
That’s why I recommend starting with someone else’s project. Once you clone their project you can copy & paste the section you need directly into your site! Here’s a couple of interesting sticky on scroll projects. The first one’s simple and the second is slightly more complex.
This first one is nice and easy. Scroll down to below the header and the top section includes 1 sticky image + 2 blocks of text which scroll normally. All three elements are wrapped in a single section and the image has a position sticky.
This project is slightly more complex, but worth getting to know. This project uses multiple sticky images + interactions to crossfade images between sections. It feels suuuuper slick and adds a nice level of animation/interaction without being distracting.
I hope those get you going! Once you get the hang of it, you can do all kinds of crazy things with Sticky positioning. We use it quite a bit across our website and we used it to make the table of contents sticky in our blog posts. Building websites is so much fun 