css3 transform做动画
css3 transform做动画
第一种用关键帧 这里就不说了 就说第二种方法用 transition属性
ps:1jquery anim不支持transform动画 但css还是支。
2 css3关键帧就是不能动态修改关键帧属性 所以采用这个。
<pre>
<img class="p1_wz1"src="{$yuming}/images/1/p1_wz1.jpg" />
.p1_wz1{
width: 2.3rem;
position: absolute;
left: 41.6%;
top: 4.2rem;
-webkit-transition: all 2s ease-in-out;
-moz-transition: all 2s ease-in-out;
-o-transition: all 2s ease-in-out;
transition: all 2s ease-in-out;
}
</pre>
然后运行下如下代码
<pre>
$(".p1_wz1").css({"-webkit-transform":"rotate(260deg)"});
</pre>
马上就旋转了起来 进度条可以参考这个方法来做
如果遇到什么不懂的地方直接关注公众号留言(本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须在文章页面给出原文连接,否则保留追究法律责任的权利。)
作者:newmiracle
出处:https://www.cnblogs.com/newmiracle/