0

我在我的网站上创建粘性导航时遇到问题。
我注意到，当向下滚动站点时，导航的活动状态的转换略微关闭。例如，当您滚动到网站的“名册”部分时，导航菜单会突出显示“关于”，直到您稍微向下滚动。

我认为这与我的固定标题有关...？我正在使用锚滚动插件。但是，我为粘性导航应用了一些 Jquery。

         $(window).scroll(function () {
         if ($(window).scrollTop()>$("#contact").offset().top){  $("ul.nav-bar > li").removeClass("active")  $("#nav_5").parent().addClass("active") } else  if ($(window).scrollTop()>$("#client").offset().top){ $("ul.nav-bar > li").removeClass("active") $("#nav_4").parent().addClass("active") } else if ($(window).scrollTop()>$("#roster").offset().top){ $("ul.nav-bar > li").removeClass("active") $("#nav_3").parent().addClass("active") } else if ($(window).scrollTop()>$("#about").offset().top){ $("ul.nav-bar > li").removeClass("active") $("#nav_2").parent().addClass("active") } else if ($(window).scrollTop()>$("#home").offset().top ){ $("ul.nav-bar > li").removeClass("active") $("#nav_1").parent().addClass("active") } });  

为了解决这个问题，我需要将什么应用于我的 js 吗？

4

1 回答 1

0

似乎您还必须考虑 #headerContainer 的高度。

$(window).scroll(function() {
    if ($(window).scrollTop() > ($("#contact").offset().top - $("#headerContainer").height())) {
        $("ul.nav-bar > li").removeClass("active")
        $("#nav_5").parent().addClass("active")
    } else if ($(window).scrollTop() > ($("#client").offset().top - $("#headerContainer").height())) {
        $("ul.nav-bar > li").removeClass("active")
        $("#nav_4").parent().addClass("active")
    } else if ($(window).scrollTop() > ($("#roster").offset().top - $("#headerContainer").height())) {
        $("ul.nav-bar > li").removeClass("active")
        $("#nav_3").parent().addClass("active")
    } else if ($(window).scrollTop() > ($("#about").offset().top - $("#headerContainer").height())) {
        $("ul.nav-bar > li").removeClass("active")
        $("#nav_2").parent().addClass("active")
    } else if ($(window).scrollTop() > ($("#home").offset().top - $("#headerContainer").height())) {
        $("ul.nav-bar > li").removeClass("active")
        $("#nav_1").parent().addClass("active")
    }
});
于 2013-01-24T00:09:43.073 回答