用js滤镜实现在IE8-的图片旋转效果实现不了

<style>

            .img_box{
               width:500px;
               height:500px;
               border:1px solid #ccc;
               text-align: center;
               margin:0px auto;
           }
           .btns{
               width:500px;
               margin:10px auto;
               text-align: center;
           }

</style>

<body>

<div class="img_box" id="boxid">
           <img id="img_id" src="img/73e5.jpg"/>
       </div>
       <div class="btns">
           <button class="btn_prev" onclick="rotateLeft(90)">向左旋转</button>
           <a class="btn_next" href="javascript:;">向右旋转</a>
       </div>
       <script src="js/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>
       <script type="text/javascript">
           function rotateLeft(rotation){

//第一种方法：

                var sin = Math.sin(rotation);
               var cos = Math.cos(rotation);
               alert(sin);
               var M11= cos,M12=-sin,M21=sin,M22=cos;
               var img_id = document.getElementById('img_id');

img_id.style.filter = "progid:DXImageTransform.Microsoft.Matrix(M11="+M11+",M12="+M12+",M21="+M21+",M22="+M22+",SizingMethod='auto expand')";

//第二种方法：

img_id.style.filter = progid:DXImageTransform.Microsoft.BasicImage(rotation=1);

}
</script>

</body>

慕桂英2234914

浏览 2141回答 1

1回答

Gotta

sin 和 cos 应该传入一个弧度值，而不是角度。弧度的计算公式为： 2*PI/360*角度。你这个方法只在IE上有作用，还不如用transform。反正………………………………………………………………谁再叫我兼容IE8-，我就怼死他！！！

2 0

随时随地看视频慕课网APP