jQuery的窗口滾動停止擊發作爲用戶滾動

當用戶向下滾動一定數量的像素的，我修復報頭。但是，在用戶滿足邏輯之後，是否有辦法停止調用窗口滾動功能？我認爲這不利於表現。見我的控制檯的屏幕截圖（http://d.pr/i/OHDX）jQuery的窗口滾動停止擊發作爲用戶滾動

$window.scroll(function() { 
    if ($window.scrollTop() > 100) { 
     $('.header').addClass('fixed'); 
     console.log('fix header'); 
    } 
    else { 
     $('.header').removeClass('fixed'); 
     console.log('unfix header'); 
    } 

}

來源

2013-04-17 cusejuice

你可以使用一個布爾值來貶低操作的成本，像「如果（！alreadFixed && $ window.scrollTop（）> 100）」[800像素後Scrolldown已顯示DIV（的 – cernunnos

可能重複HTTP ：//stackoverflow.com/questions/15798360/show-div-on-scrolldown-after-800px） –

@cernunnos這將固定，使其不能要鬆開後（滾動備份到頂部後，突破後的功能），因爲JS會停止計算scrollTop。 – Leng

你必須繼續檢查滾動位置。我假設你想在用戶滾動回100時解除它？

您目前的實現是好的，性能明智的。有一兩件事你可以添加一個檢查，看看是不是已經添加了類，或者保持一個切換，所以你知道如果類是存在的（而不是檢查）。

$window.scroll((function() { 
    var fixed = false, elem; 
    return function() { 
     var should_fix = $window.scrollTop() > 100; 
     elem = elem || $('.header'); 
     if (should_fix !== fixed) { 
      if (should_fix) { 
       elem.addClass('fixed'); 
       console.log('fix header'); 
      } else { 
       elem.removeClass('fixed'); 
       console.log('unfix header'); 
      } 
      fixed = should_fix; 
     } 
    }; 
}()) // immediate invocation, because it's awesome

來源

2013-04-17 16:23:25 Halcyon

從技術上講，$（'。header'）'可以緩存在處理程序之外，以提高性能並減少DOM交互。但是，只有它是一個靜態元素，並且不會動態添加/刪除。 – Ian

jQuery的窗口滾動停止擊發作爲用戶滾動

回答

相關問題