How to make text change/hide/appear on scroll?


I am wanting to achieve a similar effect to this where the screens scroll and change, while the div containing the text box remains static and the content changes. I can see this was made in Webflow and I’ve tried to inspect the code to understand what is happening, but I can’t figure out what is going on here. I don’t know what this effect is called, but if you could point me towards a tutorial or a cloneable site, that’d be awesome!

HI @KaylaElain

This is done pretty easily - you make on static element on left side and a scrollable element on the right side, and then you once everything is positioned you do a an animation that is triggered by scrolling action of the element on the right…

have a look at this tutorial

@IVG Thank you so much! I was massively overthinking this.

no worries!

sometimes you need someone to take a look at a problem from a different perspective, and when you have been wrecking your brain over it for a while, you some times just miss the obvious… it happens to me all the time :wink: