JQuery problema efeito hover

Question

Eu criei um script JQuery simples com pairando efeito sobre alguns links. O script funciona bem, como você pode ver aqui: Teste Amostra ... (Por favor, testá-lo em qualquer navegador diferente do IE)

Mas se eu passar o mouse rápido nos links, você vai notar os ícones de imagem não desaparecem conforme necessário. Eu tentei tudo para corrigir isso, mas não consigo encontrar uma solução adequada.

A questão agora:? Como posso ter certeza de que o efeito hover mouseOut é aplicada após o efeito hover mouseOver é completamente feito

Answer 1

Você precisa aplicar o stop() aos elementos que foram animados. Tente isto:

function hide_frame() {
   var hoveredLang = $(this).parent();              
   hoveredLang
      .find('.language-name').stop(true, true)
      .find('.download-img').stop(true, true)
      .find('.info-img').stop(true, true);
   //eccetera...

Answer 2

Becuase seu efeito de animação tem uma duração até a conclusão, você precisa lidar com casos onde pairar / unhover acontecem durante a animação.

Eu uso função stop de JQuery ( http://docs.jquery.com/Effects/stop)

Por exemplo.

.

$ ( "seletor") stop (verdadeiro, verdadeiro) .youreffect (.....);

Dê-lhe uma tentativa.