I would like to create a div, that is situated beneath a block of content but that once the page has been scrolled enough to contact its top boundary, becomes fixed in place and scrolls with the page.
Javascript – How to make a div stick to the top of the screen once it’s been scrolled to
cssjavascriptjquerypositioningscroll
Related Topic
- Html – How to align content of a div to the bottom
- Javascript – How to make the first letter of a string uppercase in JavaScript
- Html – How to make a div 100% height of the browser window
- Javascript – JSONP, and why was it created
- Javascript – Check if a user has scrolled to the bottom
- Javascript – How to decide when to use Node.js
Best Answer
You could use simply css, positioning your element as fixed:
Edit: You should have the element with position absolute, once the scroll offset has reached the element, it should be changed to fixed, and the top position should be set to zero.
You can detect the top scroll offset of the document with the scrollTop function:
When the scroll offset reached 200, the element will stick to the top of the browser window, because is placed as fixed.