KP-C

Kevin Powell - Community•4y ago

godlike

Stop sticky position scrolling at any desired point

I have a use case in which for I've a box positioned as

sticky

sticky

, so the general behaviour of

sticky

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

sticky

container to start moving along at a specified distance from top. (I'm getting the distance from

top

top

using

getBoundingClientRect

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=1100

CodePenRishab Sharma

Sticky behaviour

...