在向下滚动超过x像素时隐藏导航栏，并在向上滚动时显示

Question

我想在向下滚动时隐藏导航栏，在向上滚动时显示导航栏，但是向下滚动是在窗口向下滚动x页面向下像素数量之后发生的。（在＃section1之后的code中）向上滚动会立即显示导航栏。我正在使用此代码，但不知道如何定义位置。

var scrollp=0;
(function ($) {
    $(document).ready(function(){
        $(function () {
            $(window).scroll(function () {
                // ask about the position of scroll

                if ($(this).scrollTop() < scrollp) {
                    $('.navbar').fadeIn();
                    scrollp= $(this).scrollTop();
                } else {
                    $('.navbar').fadeOut();
                    scrollp= $(this).scrollTop();
                }
            });
        });

    });
}(jQuery));

Answer 1

只需检查else子句中的scrollTop，如下所示：

... else {
    scrollp = $(this).scrollTop();
    if (scrollp > fadeOutAfter) // Set fadeOutAfter to wherever you want the navbar to fade out
        $('.navbar').fadeOut();
}