2

所以我有一个网站，你可以在这里看到。我的粘性导航栏有问题，当我滚动到页面底部时它会闪烁。

当我的 JS 是这样的时候，它的工作不会闪烁：

<script>
    $(document).ready(function() {
        $('#nav-wrapper').height($("#nav").height());
        $('#nav').affix({
            offset: 675
        });
    });
</script>

但导航栏猛烈地跳来跳去。但是，当导航栏是这样时，它不会跳来跳去，而是会闪烁......

<script>
    $(document).ready(function() {
        $('#nav-wrapper').height($("#nav").height());
        $('#nav').affix({
            offset: $('#nav').height()
        });
    });
</script>

显然，我想要一个不会闪烁或跳跃的导航栏。我在 FireFox、Chrome 和 Safari 上检查了我的代码。请帮我！

4

1 回答 1

1

快速回答：只需将您应用于#nav.affix 的相同css 属性分配给#nav.affix-bottom 即在homegrown.css 更改中

#nav.affix {
    position: fixed;
    top: 0;
    width: 100%
}

到

#nav.affix, #nav.affix-bottom {
    position: fixed;
    top: 0;
    width: 100%
}

解释：大部分解释都在这篇文章中。但是根据我的测试，我注意到当您在页面末尾附近滚动时..闪烁正在发生 b/c.affix-bottom被突然应用到您的#navdiv.. 所以我只是给出.affix-bottom了相同的属性.affix.. 所以没有div 发生了突然的变化。希望这会有所帮助！

于 2013-02-13T07:53:03.610 回答