jQuery的动画鼠标悬停/ mouseout保持下拉菜单可见

Question

我试图做一个基本的下拉菜单与动画和运行到问题，我似乎无法弄清楚如何保持下拉部分打开，直到鼠标树叶。有没有一种简单的方法可以告诉它保持开放？我知道我对.clickme鼠标移出功能的完全错误，因为它会相应地卸载菜单。

如果任何人都可以在这个具体的例子中提供帮助，我会非常感激。

$(document).ready(function() { 

$('.clickme').mouseover(function() { 
    $('#slidebox').animate({ 
     top: '+=160' 
    }, 200, 'easeOutQuad'); 
}); 

$('.clickme').mouseout(function(){ 
    $('#slidebox').animate({ 
     top: '-=160' 
    }, 200, 'easeOutQuad') 
}); 

}）;

Answer 1

这应该让你去没有任何标记的变化：

$('.clickme, #slidebox').hover(function() { 
    $('#slidebox').stop().animate({ top: '30px' }, 200, 'easeOutQuad'); 
}, function() { 
    $('#slidebox').stop().animate({ top: '-130px' }, 200, 'easeOutQuad'); 
}); 

因为你的元素不是父/子关系，更容易把菜单上的绝对位置（其无论如何，在CSS中有130px），所以没有理由不使用它具有绝对位置的事实。给它一个镜头，我测试你的网站，似乎是我想要在菜单中的行为。

Answer 2

退房jQuery的hoverIntent