How can i achieve this element locking on screen effect while scrolling down, then it scrolls up at some point while the one below locks and so on?
Are there any tutorials on this? Thanks in advance.
Here is my public share link: LINK
(how to access public share link)
Hey @CobainLives, to make sections lock or more commonly said as “sticky”. You can set the position to Sticky. It can get a little bit tricky using this, all you have to keep in mind is that the Container of your sticky element has to be bigger than your sticky element itself.
If you want the element to stick to the top, make sure the Top property is set to 0(or any value of your preference) as shown.
how do i make it so that it sticks AFTER coming into view? And make it not sticky anymore at some point?
Like, if you look at that webflow page, the box on the left comes into view then locks and while the text on the right scrolls, and when that’s done, the box is no longer locked and scrolls up.
I have made a quick demo here: https://prototype-density.webflow.io/sticky-demo. You just have to keep in mind that the sticky element has to be smaller than the Container(Yellow Section) or the other siblings element (Blue Box).
The red box is the Card with Video and the blue box is the table of contents.
OHHHHHH, i see what’s going on here. Thank you so much for this! 
Have fun trying! Post your read-only link here if you’re having any trouble with it.
