IE9中的CSS3旋转

Question

我有一个jsfiddle应该在IE9中工作，但它不

CSS:

#MyDiv{
    width:150px;
    height:150px;       
    margin:100px 100px;
    background-color: red;
    transition:all 2s ease;
    -ms-transition:all 2s ease;}
.Rotate{
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform:rotate(360deg);
    -ms-transform: rotate(360deg);}

javascript:

$(document).ready(function () { AddRotate(); });
function AddRotate() {
    $('#MyDiv').addClass('Rotate');  
    setTimeout(function () {
        RemoveRotate();
    }, 2000);    
}
function RemoveRotate() {
    $('#MyDiv').removeClass('Rotate');
    setTimeout(function () {
       AddRotate();
    }, 2000);  
}

和HTML: <div id="MyDiv">test</div>

我不知道为什么它不工作。它是关于创建一个CSS旋转与过渡;bug在哪里，你如何修复它使它在IE9中工作?

谢谢。

Answer 1

IE9支持旋转，但不支持CSS转场。

你需要使用javascript解决方案。

我的建议是使用CSS砂纸库，因为这允许你使用标准的CSS转换，即使在IE中，这反过来意味着你不必因为IE而切换到其他浏览器的JS。

希望对你有帮助。

Answer 2

在IE9中不支持过渡，它们只在IE10中被支持。