Javascript 在页面滚动上显示第二个导航

我的站点上有两个导航，它们都位于顶部，基本上做相同的事情

我希望主（较小的）导航出现在页面上时，页面最初加载，它还没有被滚动

一旦页面滚动并且主导航不再可见，我希望辅助导航（较大）出现并固定在页面顶部

我已经有固定的顶部部分的工作，我只需要帮助淡入淡出的页面滚动部分

主导航的id为：

navMain

第二个导航的id为：

navSecondary

我在Stackoverflow上找到了这个脚本，但它似乎并没有完全按照我的要求运行

$(window).scroll(function() {
    var pxFromBottom = 350;
    if ($(window).scrollTop() + $(window).height() > $(document).height() - pxFromBottom) {
        $('#navSecondary').fadeOut('slow');
    } else {
        $('#navSecondary').fadeIn('slow')
    }
});

此脚本允许在页面最初加载时同时显示两个导航菜单，并且一旦您滚动页面，辅助导航将逐渐消失，即使您滚动回页面顶部，也不会返回

如果你想看的话，你可以确切地看到我在这里所说的内容：

---

在页面首次加载时，默认情况下，您可以使用CSS（或JS）隐藏第二个导航栏。在if-else语句中，尝试将

$（窗口）.scrollTop（）+$（窗口）.height（）和
$（文档）.height（）-pxFromBottom
的值回显到控制台，看看您是否能轻松发现问题。好的，我使用css在加载时将其隐藏，并在页面滚动时淡入。现在当我回到顶端的时候它不会消失吗？我明白了。我不确定您是否应该这样做，但我在if语句中将
-
更改为
+