3

一个关于 jsfiddle 的例子 http://jsfiddle.net/chrisloughnane/T9N3h/

这个例子在 Opera、chrome 和 firefox 中运行良好，但我找不到 IE 的转换。

同样在 Firefox 上，当有很多变换时，所有动画都会停止。

http://toys.chrisloughnane.net/

有没有更好的方法来解决这个问题？蒂亚。

HTML

<div class="display"></div>

CSS

.display {
    background-image: url("http://toys.chrisloughnane.net/images/darkhand-small-50.png");
    height: 25px;
    width: 25px;
    -webkit-transition:all 400ms;   
    -moz-transition:all 400ms;
    -o-transition:all 400ms;
    transition:all 400ms; 
    position: absolute;
    top: 200px;
    left: 200px;
}

JavaScript

$(document).ready(function() {

    function getRandom(min, max) {
        return min + Math.floor(Math.random() * (max - min + 1));
    }

    function go() {

        var iCSS = ("rotate(" + getRandom(0, 359) + "deg)");

        $(".display").css({
            '-moz-transform': iCSS,
            '-o-transform': iCSS,
            '-webkit-transform': iCSS
        });

        setTimeout(go, 600);
    }

    go();

});
4

1 回答 1

4

是的，IE9 支持 CSS 转换。您只需添加-ms-前缀。

有关更多信息，请参阅CanIUse 网站。

但是，它不支持过渡，我在问题的 CSS 代码中看到了过渡。如果您需要在 IE9（或更早版本）中支持 CSS 过渡，您可以使用CSS Sandpaper polyfill 库。

于 2013-03-03T21:07:33.393 回答