javascript - JQuery FadeOut 在错误的时间发生

Question

我有以下代码:

$(document).ready(function () {

$("#full-btns").children().delay(4000).fadeOut("slow");

$('#full-btns').hover(function() {
      $('#full-btns').children().stop().animate({opacity:'100'});
      $('#full-btns').children().show();

}, function() {
        $("#full-btns").children().fadeOut("slow");

});

当页面加载时，#full-btns 元素在淡出之前显示 4000 毫秒。我遇到的问题是，如果用户将鼠标悬停在 #full-btns 元素上，而它仍然可见，则会导致它淡出，因为 $("#full-btns").children ().fadeOut("slow"); 在悬停时调用。我希望将鼠标悬停在 #full-btns 上时始终可见。

当页面加载时，将鼠标悬停在红色 div 上，注意它是如何淡出的。这是不可取的。当悬停在红色 div 上时(虽然它是可见的)它应该保持可见

更新: http://jsfiddle.net/gazedge/nhBBc/ (现在包括解决方案)

Answer 1

使用 setInterval 和 clearInterval；

$('#full-btns').hover(function() {

      clearInterval(refreshIntervalId);        
      $('#full-btns').children().stop().animate({opacity:'100'});
      $('#full-btns').children().show();

}, function() { 
        $("#full-btns").children().fadeOut("slow");            
});

var refreshIntervalId = setInterval(function() {
     $("#full-btns").children().fadeOut("slow");
}, 4000);