Stop sticky position scrolling at any desired point
I have a use case in which for I've a box positioned as
sticky, so the general behaviour of sticky is that once the scroll position hits the sticky container then the sticky container starts moving along just like regular HTML. I want this exact same behaviour but I want the sticky container to start moving along at a specified distance from top. (I'm getting the distance from top using getBoundingClientRect function).
Main constraint in my case is that I cannot divide the box into two parts. (red box on codepen) (Also, this example is just for explanation purpose only)
codepen link - https://codepen.io/Rishab1207/pen/abKdobK?editors=11000 Replies