2

我的下拉菜单有问题。这是脚本:

function topNav() {
  $('.parent').mouseenter(function() {
    $(this).children('ul').stop().slideDown('fast');  
  });    
  $('.parent').mouseleave(function() {
    $(this).children('ul').stop().slideUp('fast');
  });
}

它运行得很好,但是如果我移动鼠标的速度足够快,以至于菜单不会完全下降,它的高度就会增加。我不明白为什么会发生这种情况以及如何解决这样的问题。有什么建议么?

谢谢你。

4

3 回答 3

0
$('.parent').mouseenter(function() {
   $(this).parent().find("ul").slideDown('fast').show();
});
$('.parent').mouseleave(function() {
  $(this).parent().find("ul").slideUp('fast').hide();
});

这应该可以正常工作...

于 2013-09-02T09:12:03.993 回答
0

我通过添加 css('height','auto') 解决了这个问题,就像这样

function topNav() {
  $('.parent').mouseenter(function() {
    $(this).children('ul').stop().css('height','auto').slideDown('fast');  
  });    
  $('.parent').mouseleave(function() {
    $(this).children('ul').stop().css('height','auto').slideUp('fast');
  });
}
于 2013-09-03T09:08:22.110 回答
0

好吧,所有鼠标悬停都会发生这种情况,并且用户体验总是讨厌使用鼠标悬停......无论如何,如果您仍然想使用它,有一种称为 Throttling 的技术可以帮助您。一个插件也实现了节流。实际上,它在给定时间内只执行一次 mousedown 事件。 http://benalman.com/projects/jquery-throttle-debounce-plugin/

因此,如果用户一遍又一遍地快速移动鼠标,它不会运行多次..

于 2013-09-02T10:19:54.353 回答