Navbar在到达滚动点之前粘到顶部，直到重新加载页面才会返回

Question

我正在尝试将粘性导航栏实现到我正在制作的网页上。

目前，当我第一次进入任何页面时，导航栏将位于其预定位置，但是一旦我滚动它就会捕捉到顶部并将保持在那里但是我滚动。 （当你滚动到顶部时，它有时会向下弹回）
当您滚动浏览导航栏位置时，预​​期的行为是坚持。

但如果你重新加载一两次页面，它将按照预期开始工作。

代码用jquery编写：

// JavaScript Document
$(document).ready(function() {
    fixNavbar();
});

//Fixed navbar on scroll past navbar pos
function fixNavbar() {
    var navOffset = $(".navigation").offset().top;

    $(window).scroll(function(){
      var nav = $(".navigation"), scroll = $(window).scrollTop();

      if (scroll >= navOffset) nav.addClass("nav-fix");
      else nav.removeClass("nav-fix");
    });
}

CSS非常简单：只有一个位置为fixed的类;

以下是操作页面： http://aktersnurra.se
在此先感谢您的帮助！

Answer 1

您的navOffset有时会收到错误的值

Answer 2

设置滚动事件时，导航栏顶部的图像仍在加载。

这意味着navOffset经常会得到错误的值。

您必须更换

$(document).ready(function () {

到

$(window).on('load', function () {

等待包括图像在内的整个页面加载。