How to scroll a div when scrolling after a certain point?

I would like to create a div that is under the content block, but after the page has been scrolled enough to reach its upper border, it locks in place and scrolls the page. I know that I have seen at least one example of this online, but I do not remember it for life.

Any thoughts?

+4
source share
1 answer

[ Working demo ]

var el = $("#sticky"); var win = $(window); var width = el.width(); var height = el.height(); var win_height = $(window).height(); window.onscroll = function() { var offset = el.offset().top + height - win_height; if ( win.scrollTop() > offset ) { window.onscroll = function() { el.css({ width: width, position: "absolute", top: win.scrollTop() + win_height - height }); }; } }; 

If you do not need to support IE-based browsers, you can use:

 position: "fixed" bottom: 0 
+1
source

All Articles