懸停在圖像太快沒有一個小故障

Question

我試圖顯示一些divs當用戶懸停在另一個div和我試圖使用fadeIn並給它的速度。我也試圖移動另一個div。代碼如下 -

$('#boardpicture2').hover(function() { 

    $('#boardpicture3').stop().animate({'margin-left': '200px'},500); 
     $('#boardpicture6').fadeIn(1000); 
}, function() { 
    $('#boardpicture3').stop().animate({'margin-left': '0'},1000); 
    $('#boardpicture6').fadeOut(500); 
}); 

但現在，如果我嘗試將鼠標懸停在DIV真快（我的意思是，如果我移動鼠標移出div的淡入完成之前那麼boardpicture6 disappers然後出現回然後淡出。你能告訴我，如果有檢查，如果淡入是完全做得到，然後才調用淡出功能的方式。

任何幫助是極大的讚賞

Answer 1

stop動畫在此之前。閱讀關於停止jQuery功能here。您必須停止動畫以確保t他之前的動畫完成。

此外，如果你想淡出（）的東西，像這樣做

$(something).hide().fadeOut(); 

這將確保該元素是隱藏的，而淡出函數被調用。 總之，

$(something).stop().hide().fadeOut(); 

Answer 2

您可以強制jQuery的停止利用.stop(true, true)

$('#boardpicture2').hover(function() { 
    $('#boardpicture3').stop().animate({'margin-left': '200px'},500); 
    $('#boardpicture6').stop(true, true).fadeIn(1000); 
}, function() { 
    $('#boardpicture3').stop().animate({'margin-left': '0'},1000); 
    $('#boardpicture6').stop(true, true).fadeOut(500); 
});