site profile thumbnail

Description

hello. I think I found a way to create the smooth scrolling effect natively in Webflow. The way it works is to wrap all content inside a sticky wrapper (content__wrapper), which itself is inside a wrapper (s__scroll) with a set height. The outermost wrapper has a "while scrolling in view" interaction that pushes all content upwards while scrolling down, together with a 90% smoothing. Sounds confusing? Well it kinda is. I'm not 100% sure why this works. Some notes: The outermost wrapper (s__scroll) needs a set height. You have to manually set this height so that it fits the height of whatever content you're using on your site. It shouldn't be exactly the height of your content, but a bit shorter (This site is 1200vh in height, and s__scroll is 900vh). - You want to make sure all your scroll interactions have the same smoothing as the smooth scroll interaction (in my case 90). I noticed some weird quirks with them otherwise. Clone it, check it out and use it for whatever. šŸ¤™
smoothscrollnativewebflowscrollinteraction

Related Made in Webflow Projects