窗口滾動來檢測頁腳動畫

Question

我試圖讓我的頁腳在用戶滾動時彈出動畫，但當用戶滾動到頂部時彈出。

我的代碼似乎適用於頁腳在您向下滾動時動畫，而不是在您返回到頂部時動畫。

此外，我試圖將它設置爲動畫，一旦您從頂部向下滾動400像素，但由於某種原因，動畫會在您滾動的那一刻發生。

$(function(){ 
    $(window).scroll(function(){ 
    if ($(window).scrollTop()<400){ 
     $("#footer").animate({"bottom" : "0px"}, 3000); 
    }else if($(window).scrollTop()>400){ 
     $("#footer").animate({"bottom" : "-150px"}, 1500); 
    } 
    }); 
}); 

歡迎所有幫助。

Answer 1

在你的代碼說

$(window).scroll(function(){ 
    if ($(window).scrollTop()<400){ 
     $("#footer").animate({"bottom" : "0px"}, 3000); 

根據上述OPX您的評論顯示頁腳。所以這意味着一旦用戶開始滾動並且滾動的距離小於400像素，頁腳就會生成動畫。這是：第一次開始滾動。這就是爲什麼在您第一次滾動時顯示頁腳。我認爲你需要這樣做：

$(function(){ 
    $(window).scroll(function(){ 
    if ($(window).scrollTop()<400){ 
     $("#footer").stop().animate({"bottom" : "-150px"}, 3000); 
    }else { 
     $("#footer").stop().animate({"bottom" : "0px"}, 1500); 
    } 
    }); 
});