Sticky Footers that move down when dynamic content gets loaded

Posted by Dominic Rodger on Stack Overflow See other posts from Stack Overflow or by Dominic Rodger
Published on 2010-05-30T16:28:09Z Indexed on 2010/05/30 16:32 UTC
Read the original article Hit count: 252

Filed under:
|
|

I've been using this snippet of jQuery to get a sticky footer:

if($(document.body).height() < $(window).height()){
        $("#footer").css({position: "absolute",top:($(window).scrollTop()+$(window).height()-$("#footer").height())+"px", width: "100%"});
}
$(window).scroll(positionFooter).resize(positionFooter);

However, that breaks when I've got expandable/collapsible divs lying around where the original content was less high than the window, since it is then stuck to the bottom of the window, rather than the bottom of the document.

Is there a way of fixing this, or a better way of doing it?

Please bear in mind that I don't have much control over the HTML, since I need to do this in Django's admin interface, which doesn't allow much injection of HTML in the places you might want to to accomplish this sort of thing (i.e. this answer and this answer don't work for me).

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about css