用滚动更改背景图像

Question

我有一堆图像应该适合整个浏览器，当你滚动时，它会改变为下一张图片，依此类推。我是新手，我真的不知道我在做什么。我一直在看这个：Create website background image that changes on a click这基本上就是我想要的，但它不是改变点击，而是改变滚动。

不知道它是否是同一个概念......任何想法？

Answer 1

您可以使用 $（窗口）.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 + "')");
});

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