jquery - 使用滚动更改背景图像

Question

我有一堆应该适合整个浏览器的图像，当您滚动时，它会更改为下一张图片，依此类推。我是新手，我真的不知道我在做什么。我一直在看这个：创建网站背景图像，单击时更改，这基本上是我想要的，但不是单击更改，而是滚动更改。

不知道是不是同一个概念……有什么想法吗？

Answer 1

您可以使用$(window).scrollTop()确定当前滚动量，使用$(body).css('background-image', '/i/image.jpg')实际更改背景图像。

$(window).scroll(function() {
    var image_url = '/i/image1.jpg'
    if ($(window).scrollTop() > 800) {
        image_url = '/i/image2.jpg';
    }
    $(body).css('background-image', "url('" + image_url + "')");
});

这只是一个概念。您应该将所有图像放入“数组”（如您的示例中）并确定要动态应用的图像。