需要幫助讓FadeTo方法使用窗口滾動事件

我想讓我的一個頁面網站的每個'部分'根據滾動位置淡入和淡出。我希望該部分保持爲display：block，因此我使用的是FadeTo/FadeOut而不是FadeIn/FadeOut方法。需要幫助讓FadeTo方法使用窗口滾動事件

想法是當每個部分在距離頂部到達一定距離時淡入淡出，當它不符合某些要求時淡入淡出。我當前的標記嘗試如下，但掙扎在搞清楚我作出了錯誤

功能：

function scrollFadeDiv(element, navheight) { 
    var offset = element.offset(); 
    var offsetTop = offset.top; 
    var totalScroll = offsetTop - navheight; 


    if (totalScroll > 0){ 
     $(element).fadeTo('slow', 0.0); 
    } else { 
     $(element).fadeTo('slow', 1.0); 
    } 


}

和我的窗口滾動事件：

$(window).on('scroll', function(){ 
    var elWrapped = $('section'); 
    scrollFadeDiv(elWrapped, 75); 
});

我的關注是因爲住（）已被棄用和委託（）對滾動事件不起作用，totalScroll變量不會在加載DOM後不斷更新/重新計算。

在此先感謝！

來源

2012-07-11 user1512126

我的建議是使用航點插件：

https://github.com/imakewebthings/jquery-waypoints

來源

2012-07-11 15:42:42 lucuma

感謝Lucuma，該解決方案的工作就好了。爲了更好地理解和改進我的工藝，我仍然在尋找我出錯的地方。再次感謝您的建議！ – user1512126 2012-07-12 13:43:32

構建一個jsfiddle來演示特定的問題並將其發佈到您的問題。我不確定這個問題與新的jquery版本中的類似事件的實況和委託有什麼關係。 – lucuma 2012-07-12 15:55:50

需要幫助讓FadeTo方法使用窗口滾動事件

回答

相關問題