粘滯導航不起作用

Question

我試圖在滾動條點擊該菜單時向菜單中添加一個「固定」類。我已經設法讓它工作，但是一旦用戶滾動回到頂端，就會出現問題。

這裏是我工作的網站：http://www.allbyor.com/

這裏是我的JS代碼：

$(window).bind('scroll', function() { 
    var menu = $('.bottom-row'); 
    if ($(window).scrollTop() >= menu.offset().top) { 
     menu.addClass('menufix'); 
    } else { 
     menu.removeClass('menufix'); 
    } 
}); 

Answer 1

您需要註冊菜單的初始值。 offset().top中的一個變量，因爲一旦將其類更改爲固定,最高值將與$(window).scrollTop()相同。

JSFiddle demo。

var menu = $('.bottom-row'); 
var menu_top_value = menu.offset().top; 

$(window).bind('scroll', function() { 
    if ($(window).scrollTop() >= menu_top_value) { 
     menu.addClass('menufix'); 

    } else { 
     menu.removeClass('menufix'); 
    } 
});