下拉菜单 jquery 出现问题

Question

我对JS和Jquery真的很陌生，我正在尝试使用slideDown制作下拉菜单，但是当我在父链接中快速悬停鼠标时，事情有点出错。

这是代码：

jQuery(document).ready(function($) {
  $('li.parent').mouseenter(function() {
    $('.sub').slideDown('fast')
  });
  $('li.parent').mouseleave(function() {
    $('.sub').slideUp('fast')
  });
});

和 HTML

 <li class="parent">
   <span>Produtos</span>
    <ul class="sub">
    <div class="sub-bg">
        <li>
          <a href='produtos.php?categoria=9'>Banho</a>
        </li>
        <li>
          <a href='produtos.php?categoria=7'>Cama</a>
        </li>
     </div>
    </ul>
   </li>

这是在线网站，所以你们可以看到问题，只需快速悬停在"Produtos"buton..

谢谢！

Answer 1

如果我没有

猜错你的问题，你只需要使用 stop（） 它会stop the currently-running animation on the matched elements，它应该没问题：

jQuery(document).ready(function($) {
    $('li.parent').mouseenter(function() {
        $('.sub').stop().slideDown('fast')
    });
    $('li.parent').mouseleave(function() {
        $('.sub').stop().slideUp('fast')
    });
});​

演示：http://jsfiddle.net/vGuHh/