событие jquery hover не работает должным образом

Question

У меня есть простое горизонтальное меню, и когда я нахожу каждый из предметов, подменю соскальзывает вниз. Таким образом, в основном это типичное меню навигации, которое мы видим так часто. Я хочу, чтобы при наведении подменю слайды вниз и вверх при выводе мыши. Моя проблема заключается в том, что, если я быстро перемещаю мышь через элементы, это случается, что более одного подменю остается видимым. Я думаю, это потому, что слайд вниз не был закончен, когда я запускаю слайд вверх. Есть идея предотвратить это? Heres мой код:

 $('#menu > li').hover(
       function() { 
        $('ul',$(this)).slideDown(); 
       }, 
       function() { 
        $('ul',$(this)).slideUp(); 
       } 
      ); 

Спасибо!

Answer 1

Вы должны позвонить stop перед тем скольжение вверх и вниз, и из вашего описания, вы должны также пройти true для обоих необязательных параметров, как это:

$('ul',$(this)).stop(true, true).slideDown(); 

Первый параметр (clearQueue) сообщает jQuery об очистке очереди анимации, останавливая любые очереди в очереди.

Второй параметр (gotoEnd) сообщает jQuery, чтобы завершить текущую анимацию. (Этот параметр может не понадобиться в вашем случае, в зависимости от желаемого эффекта.)

Answer 2

Перед вашей слайд-кнопкой вы, вероятно, можете использовать функцию stop(), чтобы остановить все текущие анимации.

http://docs.jquery.com/Effects/stop

Answer 3

, что может происходить в том, что MouseLeave событие не стрельбы на всех. Вы можете проверить это, добавив некоторые операторы console.log в начало обработчиков событий, а затем проверяя инструменты разработчика IE8 или Firebug, чтобы узнать, стреляют ли все события.

Если вы хотите прервать запущенную анимацию, jQuery has a stop() method that does that. Вы также можете захотеть, чтобы каждый slideDown запустил все остальные.

Answer 4

Это связано с тем, что ваша очередь анимации создается каждый раз, когда вы входите и оставляете каждый элемент li.

Попробуйте воспользоваться одним из hoverFlow jQuery Plugin