動畫不能用於偽元素？ IE10

Question

尤其對於IE10，這是一個問題。 我正在為偽元素設置動畫。 當我懸停偽元素時，將.skew添加.skew類，這將觸發CSS動畫。 動畫結束后， animationend會刪除該.skew類。

至少在Chrome和Firefox中會發生這種情況，但是在IE10中，添加了.skew類，但在動畫完成時並未將其刪除。 我不確定是否是這種情況，但這可能是因為第一次將.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尚不支持偽元素上的動畫事件（冒泡）。