Question

这尤其是IE10的问题。我正在制作一个伪元素。当我悬停伪元素时，会向其添加.skew类，从而触发CSS动画。动画完成后，animationend会删除.skew类。

至少在Chrome和Firefox中会发生这种情况，但在IE10中添加了.skew类，但在动画完成时不会删除。我不确定是否是这种情况，但可能是因为第一次悬停伪元素会触发动画，但是再次悬停它不会（这意味着.skew类没有被删除在上一个动画结束时。）

请参阅此处： http://jsfiddle.net/Ldh5g/

$("div").bind("animationend webkitAnimationEnd oAnimationEnd", function(){
  $(this).removeClass("skew");  
});

$("div").mouseenter(function(){
    $(this).addClass("skew");
});

无论何时悬停伪元素，动画都会播放。这适用于Chrome和Firefox。但在IE10中，动画不能播放多次。问题是如果我在非伪元素上尝试这个，它就可以了。为什么呢？

Answer 1

我使用切换事件修改您的代码。我没有尝试过，但它甚至应该在IE10上工作

http://jsfiddle.net/Ldh5g/4/

<强> JS

$( "div" ).bind( "mouseenter mouseleave", function() {
  $( this ).toggleClass("skew");
});

Answer 2

ie10还不支持伪元素上的动画事件（冒泡）。

动画没有处理伪元素？ IE10

2 个答案: