jQuery fadeOut在開始新效果之前等待效果完成

Question

我正在製作幾個信息框，並將jQuery UI效果與fadeIn/fadeOut相結合。 問題是，如果您將郵箱快速退出，則郵件淡出未完成。 我使用了回調，但是它是我的mouseleave影響它還是？

實施例：http://jsfiddle.net/6euyze8k/1/

jQuery(".holder").each(function (index, element) { 
    var infos = jQuery(this).find('.info,.socials'); 
    var docmail = jQuery(this).find('.email'); 

    jQuery(this).on({ 
     mouseenter: function() { 
      infos.show("clip", function() { 
       docmail.fadeIn(500); 
      }); 
     }, 
     mouseleave: function() { 
      docmail.fadeOut(500, function() { 
       infos.hide("clip"); 
      }); 
     } 
    }); 
}); 

任何幫助理解。

Answer 1

我已經可與您的問題適合：

jQuery(".holder").each(function (index, element) { 
    var $el = jQuery(this); 
    var infos = $el.find('.info,.socials'); 
    var docmail = $el.find('.email'); 
    $el.data('endEnter', false); 
    $el.data('endLeave', true); 

    $el.on({ 
     mouseenter: function() { 
      if($el.data('endLeave')) { 
       infos.show("clip", function() { 
        docmail.fadeIn(500, function() { 
         $el.data('endEnter', true); 
         $el.data('endLeave', false); 
        }); 
       }); 
      } 

     }, 
     mouseleave: function() { 
      if($el.data('endEnter')) { 
       docmail.fadeOut(500, function() { 
        infos.hide("clip", function() { 
         $el.data('endLeave', true); 
         $el.data('endEnter', false); 
        }); 
       }); 
      } 

     } 
    }); 
}); 

的想法是不允許火災事件，直到動畫結束，但夾動畫做了一些問題，如果你快速移動光標在&之外。

Anymway，看看這裏：

小提琴：http://jsfiddle.net/benjasHu/Lchpon4x/

祝你好運！