jquery - 如何在 jQuery 中通过滚动使背景图像淡入淡出？

Question

我想在向下滚动页面时制作一个渐变背景图像。

我曾见过带有两个 div 的东西，它们随着不透明度而逐渐消失。像这样:

<div class="background1"></div>
<div class="background2"></div>

比起某种 jQuery 代码，但我并没有真正理解它。

希望有人能帮忙。

我想可以使用 scrollTop，但我不确定如何获得它。

Answer 1

您走在正确的轨道上。将事件绑定(bind)到文档以检查滚动并查看高度。

$(document).scroll(function(){
    var scrollTop = $("html").scrollTop();
    if(scrollTop > 150){
        $(".background2").fadeIn();
    }
    else
        $(".background2").fadeOut();
})