滚动后淡入div

时间:2012-06-23 12:46:24

标签: jquery

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

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

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

由于

3 个答案:

答案 0 :(得分:8)

可以按如下方式完成:

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

DEMO: http://jsfiddle.net/ZHkY8/

答案 1 :(得分:2)

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

^^简单地反转数组:)

答案 2 :(得分:1)

我正在处理与Alexander的链接类似的东西,但需要它在屏幕顶部快于淡出100%。

您可以调整对象何时开始淡出以及何时结束与浏览器大小相关的淡入淡出。如果你想以0.2而不是0来启动它,你也可以调整开始淡入淡出不透明度。

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