Reputation:
JavaScript:
$(window).scroll(function(){
if ($(window).scrollTop() == $(document).height() - $(window).height()){
$('#footer').show();
}
});
CSS:
#footer {
display: none;
}
This is supposed to reveal a hidden div
at the bottom of a page when scrolled all of the way down to the bottom. For some reason, the hidden div
never gets shown in Firefox. Is there another method using jQuery to create the same effect?
EDIT: Here's the page where it's not working correctly in Firefox
http://safe.tumblr.com/theme/preview/34069
Upvotes: 0
Views: 293
Reputation: 26730
There may be a small difference between the max value for scrollTop and what documentHeight - windowHeight gives you, so I would propose to subtract a small safety factor:
$(window).scroll(function(){
if ($(window).scrollTop() >= $(document).height() - $(window).height() - 3) {
$('#footer').show();
}
});
Upvotes: 0
Reputation: 11588
You need to be using this:
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() == $(document).height()) {
$('#footer').show();
}
});
Upvotes: 2