jquery - 滚动后淡入 div

Question

我需要能够根据用户滚动的 px 数量淡入/淡出 div。这是我现有的jquery。我可以切换它的视图，但我想淡化该切换。这里的正确方法是什么？

$("#subOverlay").hide();

$(window).bind('scroll', function(){
    $("#subOverlay").toggle($(this).scrollTop() > 520);
});

谢谢

Answer 1

可以这样做：

$(window).bind("scroll", function() {
    if ($(this).scrollTop() > 520) {
        $("#subOverlay").fadeIn();
    } else {
        $("#subOverlay").stop().fadeOut();
    }
});

演示：http: //jsfiddle.net/ZHkY8/

Answer 2

$(window).bind("scroll", function() {
    if ($(this).scrollTop() > 520) {
        $("#subOverlay").stop().fadeOut();
     } else {
        $("#subOverlay").fadeIn();
    }
});

^^ Simply reverse the array :)

Answer 3

我正在处理类似于 Alexander 的链接的东西，但需要它在屏幕顶部以超过 100% 的速度消失。

您可以根据浏览器大小调整对象何时开始淡化以及何时结束淡化。如果你想从 0.2 而不是 0 开始，你也可以调整开始淡入淡出的不透明度。

http://www.kevinnunn.com/fadetest/