用滾動更改背景圖像

Question

我有一堆應該適合整個瀏覽器的圖像，當您滾動時，它會更改爲下一張圖片等等。我是新來的，我真的不知道我在做什麼。我一直在看這個：Create website background image that changes on a click這基本上是我想要的，但不是在點擊上進行更改，而是在滾動上進行更改。

不知道它是否是相同的概念......任何想法？

Answer 1

您可以使用$（窗口）.scrollTop（）來確定當前的滾動量和$（體）的.css（ '背景圖片'， '/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 + "')"); 
}); 

這只是一個概念。你應該把所有的圖像放在一個「數組」中（如你的例子），並確定要動態應用的圖像。