gif可以实现旋转的图片,但是怎么使用js实现的。自己想了一下,打算实现一下,整体思路也很简单,每隔一段时间,旋转一下图片,看起来就像在一直旋转一样。实例地址
旋转rotate.js的代码如下:
- /**
- * Created by YD on 5/7/15.
- * Base on Jquery
- */
- var ele ;
- //自定义函数
- $.fn.extend({
- rotate: function () {
- ele = this ;
- setInterval('singleRotate()',20);
- }
- });
- //初始角度
- var degree = 0;
- //单次旋转
- function singleRotate() {
- //一次增加50度
- degree = degree + 50 * Math.PI / 180;
- ele.CSS("transform","rotate("+degree+"deg)");
- }
代码中只需引用一下js就行了,我将其封装后放在了服务器上,大家可以直接引用
1
|
<script src="http://libs.codeboy.me/js/rotate/1.0/rotate.js"></script> |
引用前记得引用jquery,最后在自己的代码中调用rotate方法即可。
1
|
$(element).rotate(); |
来源: http://www.phpxs.com/code/1001706/