如何防止隊列建立jQuery

Question

我想讓一個導航欄只出現在鼠標移動或窗口滾動時。它應該出現3秒鐘然後消失。這是有效的，但對於我的鼠標或窗口移動的每個像素，它添加了淡入和淡出的功能，並且在jQuery動畫延遲的情況下，它一次又一次地重複這個操作，從而使導航閃爍3次永遠秒。有沒有辦法使用.clearQueue()方法來防止這種情況發生，還是有另一種更有效的方法呢？

HTML：

<div id="gallery"></div> 

<div id="control"> 

    <div id="previous-button" class="button"></div> 
    <div id="next-button" class="button"></div> 

</div> 

的jQuery：

t = 300; 

    function cBar() { 
     $("#control").fadeIn(t); 
     $("#control").delay(t*10).fadeOut(t); 
    } 

    $(window).scroll(function() { 
     console.log("scroll"); 
     cBar(); 
    }); 
    $(window).mousemove(function() { 
     console.log("mouse"); 
     cBar(); 
    }); 

Answer 1

使用setTimeout()功能與存儲定時器變量：

t = 300; 
var timer; 

function cBar() { 
    if(timer){ 
     clearTimeout(timer); 
    } 
    $("#control").fadeIn(t); 

    timer = setTimeout(function(){ 
     $("#control").fadeOut(t); 
     timer = null; 
    }, t*10); 
} 

$(window).scroll(function() { 
    console.log("scroll"); 
    cBar(); 
}); 
$(window).mousemove(function() { 
    console.log("mouse"); 
    cBar(); 
});