使导航栏消失答案

【问题标题】：Making a navbar disappear使导航栏消失
【发布时间】：2014-11-19 14:44:10
【问题描述】：

我真的希望以前没有人问过这个问题。

首先，我希望我的导航栏出现在特定数量的像素之后，我发现：

<script type="text/javascript">   (function($) {
    $(document).ready(function(){

        $(window).scroll(function(){
            if ($(this).scrollTop() > 725) {
                $('#nav-principale').fadeIn(500);
            } else {
                $('#nav-principale').fadeOut(500);
            }
        });

    }); })(jQuery);   </script>

它奏效了。现在，我正在寻找一种方法，让固定在屏幕顶部的导航栏在特定数量的像素后消失，如果可能的话。

这可能真的很简单，但我对 Javascript/jquery 一无所知。

感谢您的帮助，日尔玛

【问题讨论】：

达到特定像素数后，您可能只需执行$('#nav-principale').css('visibility', 'hidden');。
“特定数量的像素”到底是什么意思？
@Kris Hollenbeck，我真的不知道如何解释，但是当用户滚动到 4000px 时，导航会消失。虽然 Daan Heskes 已经回答了，但是谢谢！

标签： javascript jquery navbar nav

【解决方案1】：

试试这个 jQuery：

<script type="text/javascript">
$(document).ready(function() {
    $(window).scroll(function(){
        if (($(this).scrollTop() > 725) && ($(this).scrollTop() < 1025)) {
            $('#nav-principale').fadeIn(500);
        } else { 
            $('#nav-principale').fadeOut(500);
        }
    });
});
</script>

只要在 725 像素和 1025 像素之间滚动，它就会淡入，否则它会淡出。

另请注意，您不需要同时使用 (function($) { 和 $(document).ready(function(){。它都在等待文档加载。

【讨论】：