How to Make a Div Stick to the Top of the Screen When Scrolling?

Pinning a Div to the Top of the Screen

To achieve the desired effect, position the div below other content and set its initial position to absolute or relative. Once the page is scrolled enough for the div's top edge to align with the viewport, modify the position to fixed and reset the top value to zero.

CSS:

JavaScript (jQuery):

When the scrollTop exceeds 200, the div becomes fixed and scrolls with the viewport. Scrolling back up removes the fixed class, restoring its original position.

The above is the detailed content of How to Make a Div Stick to the Top of the Screen When Scrolling?. For more information, please follow other related articles on the PHP Chinese website!