I’ve spent the last few days trying to build a sticky scroll interaction, where an image moves diagonally along a sticky section while the user scrolls down. But no matter what I do, the interaction/animation doesn’t fully complete, or keeps stopping at random intervals (36%, 57%). I thought it might be some layout settings or something that I wasn’t paying attention to, but I absolutely cannot figure out what I’m doing wrong.
I made a test version using this youtube video (23:38 to 28:36) as a reference, but instead of using the HTML embed, I used Webflow’s new ‘sticky’ feature. The interaction still isn’t functioning as intended.
Is anyone able to let me know where I’m messing up, or if this is a glitch?
You should give a size (200VH) to the Div “sticky container” to make out scroll, then insert H1 title or image in “a box” div to make it visible (empty Divs disappear on preview) and Your scroll work fine
Hmm, so that solved part of this issue, but I have to have the sticky container have a height of 100vh because I want the animation to stay fixed on the center of the screen while the user scrolls.
Do you know how to do that? When I change the height of the sticky container from 200vh to 100vh, the interaction doesn’t play.