jQuery Popup在快速鼠標轉換時閃爍

Question

Popup在慢速鼠標進入和離開轉換時平穩運行。但是在快速轉換時，有時會閃爍，並且在其他時間停止在div元素上方停止顯示。

代碼jQuery中：

var flag = 1; 

jQuery('#hover').mouseenter(function(){ 
    jQuery('#popup').show(); 
}); 

jQuery('#popup').mouseenter(function(){ 
    flag = 0; 
    jQuery('#popup').show(); 
}); 

jQuery('#popup').mouseleave(function(){ 
    flag = 1; 
    jQuery('#popup').hide(); 
}); 

jQuery('#hover').mouseleave(function(){ 
    setTimeout(function() { if (flag == 1) jQuery('#popup').hide();}, 400); 
}); 

這裏有一個工作示例：http://jsfiddle.net/et65am4c/

如何解決？

在此先感謝！

Answer 1

該問題不是一個真正的Javascript問題。它正在執行你要讓它執行的命令。在div中動畫可能會更好，讓它感覺平滑。

最簡單的方法是使用jQuery animate。

var flag = 1; 
jQuery('#hover').mouseenter(function(){ 
    jQuery('#popup').stop().show('fast'); 
}); 

jQuery('#popup').mouseenter(function(){ 
    flag = 0; 
    jQuery('#popup').stop().show('fast'); 
}); 

jQuery('#popup').mouseleave(function(){ 
    flag = 1; 
    jQuery('#popup').stop().hide('fast'); 
}); 

jQuery('#hover').mouseleave(function(){ 
    setTimeout(function() { if (flag == 1) jQuery('#popup').stop().hide('fast');}, 400); 
}); 

一個更好的辦法來做到這一點，雖然，將與使用opacity財產CSS過渡。