Bottom fixed div to stuck it's parent's bottom line when scrolling by

Question

I tried to tweak this example to work in the way that fixed div is aligneg to bottom of the screen until you scroll by it's parent's bottom line where it should stuck when scrolling to further down. Tweaking with no good results so I'm asking here how it is supposed to be done?

Stop jQuery fixed position scrolling when bottom of scrolling element reaches end of parent element

Please show relevant code snippets so that we can better understand your problem and help you. Thanks :) — Arnelle Balane, Aug 09 '14 at 19:41
This is what I tried to tweak: http://jsfiddle.net/MiguelR/Bybd5/ Same thing but the red fixed div aligned to bottom of the screen and stuck in the parent div in same way when Homer comes in. — Mr O, Aug 09 '14 at 19:58

score 0 · Answer 1 · edited May 23 '17 at 11:55

Okay I finally thought I found solution from here scrolling div fixed until footer. This code:

$(document).on('scroll', function(){
var scroller = $('#scroller');
var footer = $('#footer');
var scroll_bot = scroller.offset().top + scroller.height();
var footer_top = footer.offset().top;

alert(scroll_bot);
if(scroll_bot > footer_top){
    scroller.addClass('classThatMakesBoxActRight');
}else{
    scroller.removeClass('classThatMakesBoxActRight');
}
});

Problem is now I get some popup error message, some number, when I try to scroll in browser. Would there be some bug in this code?

remove alert(scroll_bot); and the popup should go away – Gianluca Ghettini May 28 '16 at 13:15 — Gianluca Ghettini, May 28 '16 at 13:15

Bottom fixed div to stuck it's parent's bottom line when scrolling by

1 Answers1