jQuery stop animation sur focus hover

Question

Je travaille sur un module d'interface utilisateur: un formulaire de recherche qui affiche/masque selon que l'utilisateur a survolé une zone cible ou qui a encore le focus sur le champ de saisie. J'ai juste un autre tweak à prendre soin de ...

Je veux être capable d'annuler l'animation (par exemple, fadeout) s'il se trouve que je survole la zone cible. À l'heure actuelle, stop() ne semble pas faire le travail.

Conseils très appréciés. TIA

---

Voici la démo:

http://jsfiddle.net/s2wEu/

Le script actuel:

var topbar_search_hotspot = $('form[role="search"]'); 
var topbar_search_hideshow = $('form[role="search"] .row'); 

function fadeOutSearch() { 
    var element = $('#s'); 
    if (!element.hasClass("focus") && !element.hasClass("hover") && element.val() == "") { 
     $('form[role="search"] .row:visible').fadeOut("slow"); 
    } 
} 

topbar_search_hotspot.blur(function() { 
    topbar_search_hideshow.removeClass("focus"); 
    setTimeout(fadeOutSearch, 1000); 
}).focus(function() { 
    $(this).addClass("focus"); 
}); 

topbar_search_hideshow.hide(); 
topbar_search_hotspot.hover(function() { 
    if (topbar_search_hideshow.is(':animated')) { 
     topbar_search_hideshow.stop().animate({opacity:'100'}); 
    } else { 
     topbar_search_hideshow.fadeIn("slow"); 
    } 
}, function(e) { 
    setTimeout(fadeOutSearch, 1000); 
    topbar_search_hotspot.removeClass("hover"); 
}); 

topbar_search_hotspot.hover(function() { 
    $(this).addClass("hover"); 
    $('#s').focus(); 
}, function(){ 
    setTimeout(fadeOutSearch, 1000); 
    $(this).removeClass("hover"); 
}); 

Answer 1

Est-ce que le remplacement topbar_search_hideshow.stop().animate({opacity:'100'}); avec topbar_search_hideshow.stop(false,true).hide().fadeIn(); le fixer comme démontré dans le violon suivant? http://jsfiddle.net/7BDCB/