使用Chrome时未触发Mouseleave / Mouseout

Question

正如主题所述，我遇到了使用Chrome时未触发Mouseleave / Mouseout事件的问题。如果鼠标当前所在的div元素在下方动画而不移动鼠标本身，则会发生这种情况。即使是伪类：悬停也不会被删除。有趣的事实：这在使用Firefox时效果很好..最新消息？

以下是请求的jsfiddle example

/*
    NOTE: DO NOT move the cursor after you have clicked the "animated" div and the 
    "mouseleave / mouseout" as well as the ":hover" pseudo class is not removed. That is, if you use Chrome as 
    a webbrowser...     
*/
var animated = $('.animated');

animated.on('mouseenter mouseover', null, null, function(e) {  
    $(this).html('mouseenter');
});

animated.on('mouseleave mouseout', null, null, function(e) {    
    $(this).html('mouseleave');
});

animated.on('click', null, null, function(e) {    
    $(this).animate({ 'margin-left': '20.0rem'}, { duration: 1000} ); 
});

任何人都可以体验到这一点并可能有解决方案吗？

提前致谢！

干杯， 扬