css3变换用于IE的rotateY和transform-origin

时间:2014-03-27 06:11:09

标签: jquery css3

我尝试使用Animate element transform rotate,但在IE 6,7,8中失败了!

这是我的代码:

$('.button').click(function(){
    $('.hexagon').animate({
        borderSpacing: 150
    },{
        step:function(now,fx){
            var costheta = Math.cos(now*Math.PI*2/360),
                sintheta = Math.sin(Math.PI*2/360),
                m11 = costheta,
                m12 = -sintheta,
                m21 = sintheta,
                m22 = costheta,
                matrix = 'M11='+m11+',M12='+m12+',M21='+m21+',M22='+m22;
            $(this)
            .css('transform','rotateY('+now+'deg)')
            .css('transform-origin','100% 50%')
            .css('filter','progid:DXImageTransform.Microsoft.Matrix(sizingMethod=\'auto expand\','+matrix+')')
            .css('-ms-filter','progid:DXImageTransform.Microsoft.Matrix(SizingMethod=\'auto expand\','+matrix+')');
        }
    },'linear');
});

http://jsfiddle.net/UserNaN/j7sDa/

请帮助我!

1 个答案:

答案 0 :(得分:0)

  

IE8及更早版本不支持CSS转换.IE9使用-ms-transform和IE10,从不使用普通转换。

See the Link