滾動時更改div背景（jQuery）

我需要jQuery幫助！我正在使用jquery-3.1.1.min和jquery.color-2.1.0。滾動時更改div背景（jQuery）

我得到了一個至少有一個「頂部」div和「footer」div的網頁。兩者都被設置爲固定。我想要的是：當您向下滾動div的背景時，需要更改背景。當您再次滾動時，應該將其更改爲原始背景。

我有以下jQuery代碼。第一部分工作正常;當我向下滾動時，背景會發生變化。我的問題是當我向上滾動時，我如何讓他們再次改變。

我已經在下面的代碼中用'else'試過了，但那不起作用。誰可以幫忙？對jQuery不太好。

$(document).scroll(function(){ 
    if($(this).scrollTop() > 90){ 
     $(".top").animate({"background-color":"#101010"},'slow'); 
     $(".footer").animate({"background-color":"#101010"},'slow'); 
    }else{ 
     $(".top").animate({"background-color":"rgba(16, 16, 16, 0.8)"},'slow'); 
     $(".footer").animate({"background-color":"rgba(16, 16, 16, 0.8)"},'slow'); 
    } 
});

來源

2016-11-17 derrtyones

你在第二人有背景是一樣的，只有80％的不透明度。那是你想要做的嗎？嘗試輸出到瀏覽器中的控制檯日誌以查看滾動被調用的時間以及是否獲取其他語句。 – fanfavorite

是的，他們在默認情況下是不透明的。當我向下滾動時，它變爲＃101010，但是當我向上滾動時，什麼都沒有發生。我不認爲其他人在工作。 – derrtyones

你確認了嗎？ scrollTop要麼在90以上，要麼根本不觸碰滾動功能。如果您創建一個fiddleJS示例，那麼可以更容易地看出您可能會做錯什麼。 – fanfavorite

好吧我經過很多次嘗試後自己解決了。首先我使用了「else if」語句。

if($(this).scrollTop() > 89){ 
    //change backgrounds here 
}else if($(this).scrollTop() < 90){ 
    //change backgrounds back 
}

它然後工作，但有一個很大的延遲。經過一番谷歌搜索我發現它被稱爲幾次第二，所以我解決了使用stop（）函數：

$(".top").stop().animate({"background-color":"rgba(16, 16, 16, 0.8)"},'slow');

來源

2016-11-17 23:20:43 derrtyones

滾動時更改div背景（jQuery）

回答

相關問題