2

我正在尝试使用动画制作一个基本的下拉菜单，并且遇到了我似乎无法弄清楚如何在鼠标离开之前保持下拉部分打开的问题。有没有一种简单的方法可以告诉它保持开放？我知道我对 .clickme mouseout 功能的看法是完全错误的，因为它会相应地卸载菜单。

如果有人可以在这种特定情况下提供帮助，我将非常感激。

$(document).ready(function() {

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

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

});

4

2 回答 2

1

查看 jquery hoverIntent

于 2010-04-10T00:36:28.373 回答
1

这应该让您无需任何标记更改即可：

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

Since your elements aren't parent/child related, easier to put absolute positions on the menu (it has 130px in the CSS anyway), so no reason not to use the fact it has an absolute position. Give it a shot, I tested against your site, seems to be the behavior I'd want in a menu.

于 2010-04-10T00:51:56.280 回答