Javascript 隐藏/显示导航栏时，刷新页面时导航栏可见，然后在我滚动时消失

我已经创建了一个页面，滚动时第二个导航条会出现，当窗口位于顶部时应该隐藏：0。刷新页面时，导航栏可见，然后在滚动时消失，然后出现在scrollPos设置为“显示”的位置

如何使其在刷新页面时隐藏

网页是www.fareastfestival.com，请查看帮助

以下是我使用的JS代码：

$(document).ready(function() {

    var navOffset = $("nav1").offset().top;

    $("nav").wrap('<div class="nav-placeholder"></div>');
    $(".nav-placeholder").height($("nav").outerHeight());

    $(window).scroll(function(){
        var scrollPos = $(window).scrollTop(); 

        if (scrollPos >= navOffset) {
            $("nav").removeClass("hide");
            $("nav").addClass("fixed");
            $(".navlogo").show();
        } 
        else {
            $("nav").addClass("hide");
            $("nav").removeClass("fixed");
            $(".navlogo").hide();
        }
    });

});

$（文档）.ready（函数（）{
var navOffset=$（“nav1”）.offset（）.top；
美元（“nav”）。换行符（“”）；
$（.nav占位符”）.height（$（.nav”）.outerHeight（）；
$（窗口）。滚动（函数（）{
var scrollPos=$（window.scrollTop（）；
如果（滚动位置>=导航偏移）{
$（“nav”）.removeClass（“隐藏”）；
美元（“nav”）.addClass（“固定”）；
$（“.navlogo”）.show（）；
} 
否则{
$（“nav”）.addClass（“隐藏”）；
$（“nav”）.removeClass（“固定”）；
$（“.navlogo”）.hide（）；
}
});
});

将隐藏类添加到html文件中的nav，如so

将隐藏类添加到html文件中的nav，如so

只需将.hide类添加到html元素中即可。 下面是一个示例（第7行）：

$（文档）.ready（函数（）{
var navOffset=$（“nav1”）.offset（）.top；
美元（“nav”）。换行符（“”）；
$（.nav占位符”）.height（$（.nav”）.outerHeight（）；
$（“nav”）.addClass（“隐藏”）；
$（窗口）。滚动（函数（）{
var scrollPos=$（window.scrollTop（）；
如果（滚动位置>=导航偏移）{
$（“nav”）.removeClass（“隐藏”）；
美元（“nav”）.addClass（“固定”）；
$（“.navlogo”）.show（）；
} 
否则{
$（“nav”）.addClass（“隐藏”）；
$（“nav”）.removeClass（“固定”）；
$（“.navlogo”）.hide（）；
}
});
});

---

上面的代码动态添加该类。您也可以只添加到HTML中

只需将.hide类添加到HTML元素中即可。 下面是一个示例（第7行）：

$（文档）.ready（函数（）{
var navOffset=$（“nav1”）.offset（）.top；
美元（“nav”）。换行符（“”）；
$（.nav占位符”）.height（$（.nav”）.outerHeight（）；
$（“nav”）.addClass（“隐藏”）；
$（窗口）。滚动（函数（）{
var scrollPos=$（window.scrollTop（）；
如果（滚动位置>=导航偏移）{
$（“nav”）.removeClass（“隐藏”）；
美元（“nav”）.addClass（“固定”）；
$（“.navlogo”）.show（）；
} 
否则{
$（“nav”）.addClass（“隐藏”）；
$（“nav”）.removeClass（“固定”）；
$（“.navlogo”）.hide（）；
}
});
});

---

上面的代码动态添加该类。您也可以只添加到HTML中

在您的html文件中，将包含.nav类的对象也指定为.hide类。您可以将包含nav的html文件的这一部分添加到您的问题中吗？更改为Ahhh图例-非常感谢，这已经奏效了。。。。。对不起，我第一次编码！Cheers在您的html文件中，将包含.nav类的对象也设置为.hide类。您可以将包含nav的html文件的这一部分添加到您的问题中吗？更改为Ahhh图例-非常感谢，这已经奏效了。。。。。对不起，我第一次编码！谢谢你的帮助，上面的帖子解决了这个问题。谢谢你的帮助，上面的帖子解决了这个问题。再次感谢

$(document).ready(function() {

    var navOffset = $("nav1").offset().top;

    $("nav").wrap('<div class="nav-placeholder"></div>');
    $(".nav-placeholder").height($("nav").outerHeight());
    $("nav").addClass("hide");

    $(window).scroll(function(){
        var scrollPos = $(window).scrollTop(); 

        if (scrollPos >= navOffset) {
            $("nav").removeClass("hide");
            $("nav").addClass("fixed");
            $(".navlogo").show();
        } 
        else {
            $("nav").addClass("hide");
            $("nav").removeClass("fixed");
            $(".navlogo").hide();
        }
    });

});