0

我试图让我的一页网站的每个“部分”根据滚动位置淡入和淡出。我希望该部分保留为 display:block，因此我使用FadeTo方法而不是 FadeIn/FadeOut。

这个想法是让每个部分在距离顶部一定距离时淡入，当它不满足某些要求时淡出。我目前的标记尝试如下，但努力找出我在哪里犯了错误

功能：

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);
});

我担心的是，由于live()已被弃用，并且delegate()不适用于滚动事件，因此在加载 DOM 后，totalScroll 变量不会不断更新/重新计算。

提前致谢！

4

1 回答 1

0

我的建议是使用航点插件：

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

于 2012-07-11T15:42:42.157 回答