jQuery旋转插件,支持Internet Explorer 6.0 + 、Firefox 2.0、Safari 3、Opera 9、Google Chrome,高级浏览器下使用Transform,低版本ie使用VML实现。调用和方法: < strong> rotate(angle) angle参数:[Number]–默认为0–根据给定的角度旋转图片例如:
$("#img").rotate(45);
rotate(parameters) parameters参数:[Object]包含旋转参数的对象。支持的属性:
$("#img").rotate({angle:45});
$("#img").rotate({bind:{click:function(){$(this).rotate({angle:0,animateTo:180})}}});
$("#img").rotate({
bind: {
click: function() {
$(this).rotate({
duration: 6000,
angle: 0,
animateTo: 100
})
}
}
});
function(x,t,b,c,d){return-c*((t=t/d - 1) * t * t * t - 1) + b
}
Where:t:current time,b:begInnIng value,c:change In value,d:duration,x:unused No easing(linear easing):
function(x,t,b,c,d){return(t/d) * c
}
Example(click on arrow):
$("#img").rotate({bind:{click:function(){$(this).rotate({angle:0,animateTo:180,easing:$.easing.easeInOutElastic})}}});
$("#img").rotate({bind:{click:function(){$(this).rotate({angle:0,animateTo:180,callback:function(){alert(1)}})}}});
getRotateAngle 这个函数只是简单地返回旋转对象当前的角度。例如:
$("#img").rotate({angle:45,bind:{click:function(){alert($(this).getRotateAngle())}}});
stopRotate 这个函数只是简单地停止正在进行的旋转动画。例如:
$("#img").rotate({bind:{click:function(){$("#img").rotate({angle:0,animateTo:180,duration:6000});setTimeout(function(){$("#img").stopRotate()},1000)}}});
用这个可以实现很多关于旋转的网页特效。
原文:http://www.cnblogs.com/loveYN/p/4530083.html