javascript - .fadeIn() 和 .fadeOut() 的用法

Question

我有以下 JavaScript 代码:

$(window).scroll(function () {
    if ($(window).scrollTop() > 250) { 
        $('#logoheader').css("opacity", 1);
    }
    else{
        $('#logoheader').css("opacity", 0);
    }
});

这允许我在滚动经过横幅后显示 Logo 。然而，这却是一副冷硬的样子。我想让这更顺利一点，因此我尝试使用 .fadeIn() 和 .fadeOut() 但我无法让它工作。有没有一种快速且简单的方法可以做到这一点？请注意，由于兼容性问题，我无法使用 CSS 动画。

Answer 1

JS:

$(window).scroll(function () {
    if ($(window).scrollTop() > 250) { 
        $('#logoheader').fadeIn('slow');
    }
    else{
        $('#logoheader').fadeOut('slow');
    }
});

CSS(添加的 CSS 仅用于显示功能，display:none; 是您实际需要的唯一 CSS):

#logoheader {
    display:none;
    height:100px;
    background:#000;
    color:#fff;
}

JSFiddle