Figuring Webflow Out

Now that I’m at the stage of creating a horizontal scroll on one of my pages, as well as adding scroll interactions to most of my text so that it fades in and out as it moves through the viewport.

Horizontal Scroll

This video on the Webflow website (and Youtube channel) was the most helpful in teaching me how to make a horizontal scroll in Webflow really quickly! I watched it through once, then played it as I followed along with my own design. It was actually a good bit easier than I was expecting, because I’ve been struggling with a good few of the interactions I’ve tried up until now.

Text Fades

As for making my text fade in and out, as well as move up in some instances, I already had a basic idea of how to do this. On my first try with my first draft site, however, it didn’t look that smooth. So, again, I took to the wonderful world of Youtube to find a way to do it better. I came across this video, and making this interaction was explained very well.

I have run into some issues with text fading out in front of other elements as they’re scrolled, rather than behind. I am going to play about with relative positioning and the Z-index to find a way around this.