1

这尤其是 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 中，动画不能多次播放。问题是，如果我在非伪元素上尝试这个，它会起作用。为什么？

4

2 回答 2

0

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

于 2013-10-30T05:56:12.313 回答
0

我使用切换事件修改您的代码。我还没有尝试过，但它甚至可以在 IE10 上运行

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

JS

$( "div" ).bind( "mouseenter mouseleave", function() {
  $( this ).toggleClass("skew");
});
于 2013-10-02T16:41:25.837 回答