Page footer bounces up and down in view as content changes from jQuery DOM manipulations (add/remove/etc)
My page generates a lot of information dynamically and uses jQuery to add/remove show/hide stuff in the DOM.
This causes the page footer to bounce up and down in the visible area of the screen as the page empties and loads new content.
<html>
<head/>
<body>
<div id="content"/>
<div id="footer"/>
</body>
</html>
Ideally the page footer would never be visible to the user without scrolling down because the footer is distracting information that the user d开发者_开发知识库oesn't neeed to see unless he or she is looking for it.
Should I position the footer dynamically with jQuery?
Something like this?
$(window).resize(function() {
$("#footer").css('top', $(window).height() + 20);
});
I recommend setting the CSS style 'min-height' on the 'content' div. This will allow you to push the footer down.
Bob
UPDATE: Here is an example: http://jsbin.com/onasi/3/edit
精彩评论