您好,登录后才能下订单哦!
密码登录
登录注册
点击 登录注册 即表示同意《亿速云用户服务条款》
网上发现一个很有意思的jQuery旋转插件,支持Internet Explorer 6.0+ 、Firefox 2.0 、Safari 3 、Opera 9 、Google Chrome,高级浏览器下使用Transform,低版本ie使用VML实现。
调用和方法:
rotate(angle)
angle参数:[Number] – 默认为 0 – 根据给定的角度旋转图片
例如:
1 | $( "#img" ).rotate(45); |
rotate(parameters)
parameters参数:[Object] 包含旋转参数的对象。支持的属性:
1 | $( "#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
这个函数只是简单地返回旋转对象当前的角度。
例如:
1 $("#img").rotate({ 2 angle: 45, 3 bind: { 4 click : function(){ 5 alert($(this).getRotateAngle()); 6 } 7 } 8 });
stopRotate
这个函数只是简单地停止正在进行的旋转动画。
例如:
1 $("#img").rotate({ 2 bind: { 3 click: function(){ 4 $("#img").rotate({ 5 angle: 0, 6 animateTo: 180, 7 duration: 6000 8 }); 9 setTimeout(function(){ 10 $("#img").stopRotate(); 11 }, 1000); 12 } 13 } 14 });
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。