懸停意圖不工作

Question

我重新檢查我的代碼很多次，我在另一個網站上使用類似的東西。 這裏是鏈接到該網站： http://bit.ly/34XhDb

//add hover intent to dropdown 
jQuery(document).ready(function(){ 
var config = { 
sensitivity: 3, // number = sensitivity threshold (must be 1 or higher) 
interval: 100, // number = milliseconds for onMouseOver polling interval 
over: doOpen, // function = onMouseOver callback (REQUIRED) 
timeout: 1200, // number = milliseconds delay before onMouseOut 
out: doClose // function = onMouseOut callback (REQUIRED) 
}; 

function doOpen() { 
    jQuery(this).addClass("hover"); 
    jQuery('ul:first',this).fadeIn(); 
} 
function doClose() { 
    jQuery(this).removeClass("hover"); 
    jQuery('ul:first',this).fadeOut(); 
} 
jQuery("ul#main_catnav li").hoverIntent(config); 

}); 

我與調試檢查，但並不顯得衝突，再加上正在應用的類懸停的。

謝謝！

Answer 1

的問題不是該插件，這是你的CSS，你有這樣的：

ul#main_catnav ul { /*...other styles... */ display: none; } 
ul#main_catnav li:hover ul { display: block} 

所以，當鼠標離開該:hover未再應用，它是由CSS，JavaScript不立即隱藏。得到它的工作，你需要添加li.hover爲好，像這樣：

ul#main_catnav ul { /*...other styles... */ display: none; } 
ul#main_catnav li:hover ul, ul#main_catnav li.hover ul { display: block} 

佔的元素或者由鼠標懸停，或具有類.hover就像你與hoverIntent插件給它。