Остановить множественные события, запускающие JQuery fadeTo

Question

Поэтому я хочу остановить несколько событий, если я наведу курсор мыши на элемент div. Это мой код

$( "#menu" ).hover(
  function() {
    $("#menu").fadeTo("slow",0.8);
  },
  function() {      
    $("#menu").fadeTo("slow",0);
   }
);

Я пробовал с stop() а также stopPropagation() но не удалось, может быть, я не использовал их должным образом.

Я хочу, чтобы выполнялся только первый, и чтобы отменить все события, которые пользователь мог вызвать во время fadeTo() анимация. После анимации div должен снова быть "доступным".

Answer 1

Использование .stop() Функция JQuery с true, false аргументы:

$( "#menu" ).hover(
  function() {
     $("#menu").stop(true, false).fadeTo("slow",0.8);
  },
  function() {        
     $("#menu").stop(true, false).fadeTo("slow",0);
  }
);

.stop( [clearQueue ] [, jumpToEnd ] )

Остановите текущую анимацию на соответствующих элементах. [читать дальше]

Таким образом, он очистит Queqe, но НЕ будет прыгать до конца.

JSFIDDLE

Answer 2

Ты пытался stop() с true, true?

$("#menu").stop(true, true).fadeTo("slow",0.8);