user1115666
user1115666

Reputation:

javascript doesn't work in firefox

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

Answers (2)

Niko
Niko

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

hohner
hohner

Reputation: 11588

You need to be using this:

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
       $('#footer').show();
   }
});

Upvotes: 2

Related Questions