jquery - 向下滚动 100% 屏幕高度后更改 CSS 类

Question

我正在制作一个单页网站，我想在第二部分显示导航菜单直到结束。我发现了这个问题： Change CSS class after scrolling 1000px down

...我使用AlienWebguy的答案

$(document).scroll(function() {
    $('#menu').toggle($(this).scrollTop()>1000)
});​ 

但我不想做1000px。我想使用它 100% 的屏幕，它可以随着不同的平台或分辨率而改变。

你知道我能做什么吗？

Answer 1

用这个：

$(document).scroll(function() {
    var windowHeight = $(window).height();
    $('#menu').toggle($(this).scrollTop()>windowHeight)

});

Answer 2

您可以替换1000为$(window).height()

如：

$(document).scroll(function() {
    $('#menu').toggle($(this).scrollTop()>$(window).height())
});

Answer 3

你可以使用它：

$(document).on("scroll", function(){
    if($(document).scrollTop() >= ($(document).height() - $(window).height())){
        //here, you're at the bottom of the page
        console.log("BOTTOM");
    } else {
        //here, you're not arrived yet
    }
});

理论上，它适用于每种屏幕尺寸。