Search code examples
jqueryhovermouseout

JQuery hover effect problem

I have created a simple JQuery script with hovering effect on some links. The script works fine as you can see here : Test Sample ... (Please test it on any browser other than IE)

But if i hover fast on the links, you will notice the image icons do not disappear as required. I have tried everything to fix this but i can't find a suitable solution.

The question now: How can i be sure the mouseOut hover effect is applied after the mouseOver hover effect is completely done ?

Solution

  • You need to apply the stop() to the elements that have been animated. Try this:

    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...