Question

我正在尝试根据它们与滚动条位置的个别接近度来设置一系列div的不透明度。

这就是我到目前为止 - http://jsfiddle.net/jGeYg/1/

当你位于窗口顶部时，我设法将不透明度设置为0，当你到达div的顶部时，它会升至1。

我想要实现的目标是，直到你在div上方50px并且当你在div的顶部时达到完全不透明度时才开始提高不透明度。基本上它是不透明度变化的范围

$('div').position().top - 50 -> $('div').position().top //psuedo code

我不想使用插件。我在数学而不是代码方面遇到了麻烦。

Answer 1

http://jsfiddle.net/b9ZCk/3/ 我添加了一些调试文本来显示位置和不透明度。

Answer 2

我不确定这是否是您想要的效果..但请尝试让我知道，

$(window).scroll(function() {
    var st = $(this).scrollTop();
    $('.block').each(function(index) {
        if (($(this).offset().top-st) < 50) {
            $(this).css({
                'opacity': (0 + (st / $(this).offset().top))
            });
        } else {
            $(this).css({'opacity': 0.1});
        }
    })
});

DEMO： http://jsfiddle.net/skram/jGeYg/5/

设置与滚动位置相关的div不透明度

2 个答案: