0

我多次重新检查我的代码，并在另一个正在运行的网站上使用类似的东西。这是该网站的链接：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);

});

我使用调试进行了检查，但似乎没有冲突，而且正在应用悬停类。

谢谢！

4

1 回答 1

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插件提供的类一样。

于 2010-11-18T14:50:21.790 回答