使用淡入淡出效果創建粘滯導航

Question

我正在使用以下代碼創建粘滯導航菜單。我希望在向下滾動頁面時淡入此導航（一旦它變成「固定」）。我試着不透明度，添加和刪除類，但似乎沒有任何讓我相當有...

function fixDiv() { 
    var $cache = $('#menu-1'); 
    if ($(window).scrollTop() > 150) 
    $cache.css({'position': 'fixed', 'top': '0px'}).addClass("mega-fixed"); 
    else 
    $cache.css({'position': 'relative', 'top': 'auto'}).removeClass("mega-fixed"); 

} 
$(window).scroll(fixDiv); 
fixDiv(); 

我嘗試使用不透明元素的CSS在上述範圍內，具有「過渡：全1」應用效果到增加的「超級固定」類。當我向下滾動頁面時，該效果在粘滯導航中優雅淡化。但是，當滾動備份頁面時，導航消失。我可以告訴大家，爲什麼這是通過代碼發生的事情，但我不能糾正...

Answer 1

之所以能夠與jQuery航點，以實現這一點，下面的代碼：

$('body').waypoint(function() { 
     $('#megamenu-1').addClass('mega-fixed').css({ 
      'display' : 'none' 
     }).fadeIn(100); 
     $('.mega-fixed').fadeOut(100); 
     $('.mega-fixed').removeClass('mega-fixed').fadeIn(100); 

}, {offset: -40 });