How to make div follow scrolling smoothly with jQuery?
- by Martti Laine
Hello
I'm creating a blog layout, which has an sidebar. In sidebar there are sections/boxes, but the last one of these boxes should follow scrolling when none of the other boxes are visible.
So, when user scrolls down, he sees a normal sidebar, but when user has went down enough, sidebar ends but the last box starts to follow on the top of the screen. I have seen this a lot on different kind of sites.
So hard to explain with my english. I already made it to follow screen smoothly with animate() but couldn't get it like this. Hope you understood.
I already tried in Google for almost an hour but couldn't figure out any keywords (due to my bad english).
EDIT:
My code at the moment:
$(window).scroll(function(){
$.each($('.follow-scroll'),function(){
var eloffset = $(this).offset();
var windowpos = $(window).scrollTop();
if(windowpos<eloffset.top) {
var finaldestination = 0;
} else {
var finaldestination = windowpos;
}
$(this).stop().animate({'top':finaldestination},200);
});
});
