css3的问题 transform旋转问题

css3的问题 transform旋转问题

并没有出现你描述的情况，谷歌浏览器下，确实是以顶部中心点为轴心左右摆动。
如果你不是，查看下代码，是否样式出现了覆盖的情况。




  
  



.rot{-webkit-animation:rot 3s linear;}
@-webkit-keyframes rot{
0%,20%,40%,60%,80%,100%{transform-origin:top center;}
0%{transform: rotate(0deg);}
20%{transform:rotate(20deg);}
40%{transform:rotate(-15deg);}
60%{transform:rotate(10deg);}
80%{transform:rotate(-5deg);}
100%{transform:rotate(0deg);}
}
  









追问我刚刚将你代码复制下来，用谷歌浏览器打开，图片还是以对角线相交的中心点左右摆动，用ie也是这种情况追答我的代码……用IE9以上版本打开，应该是没有任何效果的。因为我只写了-webkit-。只会在谷歌内核浏览器才有效。其他火狐，IE等都没效果的。
你真的是只复制我的代码打开？追问我把-webkit-animation改成了-ms-animation就可以ie显示啊追答我在别人电脑上打开也是正常的呀，你可以试试别人的电脑。理论上代码是没有问题的。我的是chrome 43版。如果不是样式被覆盖的话，那我不知道原因了。或许是版本问题吧。爱莫能助~追问好吧，还是谢谢你

如以上回答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！

点此我要举报以上问答信息