jQuery hoverIntent插件在父hover时显示/隐藏div，但在hover时继续显示

我有一个按钮，当鼠标hover时（鼠标hover）在它下面显示一个div。 当徘徊（mouseout）时，div消失了。

这一切都运行良好，但现在我需要将div保持在按钮下方，显示用户是否hover在该div上（与div内的内容进行交互）。

现在这是不可能的，因为当你将鼠标hover在触发div显示的按钮后，div会立即消失。

我正在使用hoverIntent jQuery插件来实现这一目标。

// This is the button that when hovered // triggers the div below it to show $('#hoverMeToShowHideDiv').hoverIntent(function () { $("#displayDiv").stop().slideDown('slow'); }, function () { // I don't want the div to hide if user hovers over it $("#displayDiv").stop().slideUp('slow'); }); 

HTML：

 
 // some stuff 
 
 // some other stuff that I want to // keep showing if users hover over it  

Answer 1

在按钮和#displayDiv周围粘贴另一个div #wrapperDiv并将hoverIntent附加到#wrapperDiv而不是按钮：

 $('#wrapperDiv').hoverIntent(function () { $("#displayDiv").stop().slideDown('slow'); }, function () { // I don't want the div to hide if user hovers over it $("#displayDiv").stop().slideUp('slow'); }); 

HTML：

 
 
 // some stuff 
 
 // some other stuff that I want to // keep showing if users hover over it