删除固定导航菜单弹跳-jQuery？

Question

我修改过的模板的有效演示可以在以下网址找到：

https://newbloggerthemes.com/base-wp-blogger-template/demo/

我一直无法确定是什么导致固定导航菜单的烦人反弹。 如果向下滚动页面，则菜单应向上移动并在其顶部边框到达页面顶部时停止； 但是，它实际上仅移到页面顶部上方，然后回弹，从而导致恼人的反弹。

我如何摆脱这种反弹？ 我假设这可能是由用于查询菜单位置的jQuery代码引起的。 好像代码是在事后解决问题，而不是从一开始就阻止它发生。

我已经从原始模板中删除了标题，以便菜单最初显示在顶部。 但是，当用户第一次向下滚动页面时，菜单会以类似的方式反弹，因此缺陷在原始模板中，而不是由于我所做的任何更改所致。

如果下面的代码不够用，我已经在下面的URL上发布了修改后的模板。

https://1drv.ms/t/s!AnHSMVz7JJ2Ocf9KoYS67t_6ZqI

jQuery(document).ready(function($) {
    var $filter = $('.main-navigationbwrap');
    var $filterSpacer = $('<div />', {
        "class": "filter-drop-spacer",
        "height": $filter.outerHeight()
    });


    if ($filter.size())
    {
        $(window).scroll(function ()
        {
            if (!$filter.hasClass('fix') && $(window).scrollTop() > $filter.offset().top)
            {
                $filter.before($filterSpacer);
                $filter.addClass("fix");
            }
            else if ($filter.hasClass('fix')  && $(window).scrollTop() < $filterSpacer.offset().top)
            {
                $filter.removeClass("fix");
                $filterSpacer.remove();
            }
        });
    }

});

Answer 1

好的，您已经删除了标题HTML。

现在您还可以删除该jQuery。 因为要确保菜单导航位置始终固定在顶部，所以只能通过CSS做到这一点。 CSS示例如下。

.site-headerbwrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
}

如果您遇到这种情况：请将CSS代码粘贴在[ ]]></b:skin>行之前，然后保存您的模板