演示1 直接旋转一个角度
1 | $('#img1').rotate(45); |
演示2 鼠标移动效果
1 2 3 4 5 6 7 8 9 | $('#img2').rotate({ bind : { mouseover : function(){ $(this).rotate({animateTo: 180}); }, mouseout : function(){ $(this).rotate({animateTo: 0}); } }}); |
演示3 不停旋转
1 2 3 4 5 | var angle = 0;setInterval(function(){ angle +=3; $('#img3').rotate(angle);}, 50); |
1 2 3 4 5 6 7 8 | var rotation = function (){ $('#img4').rotate({ angle: 0, animateTo: 360, callback: rotation });}rotation(); |
1 2 3 4 5 6 7 8 9 10 11 | var rotation2 = function(){ $('#img5').rotate({ angle: 0, animateTo: 360, callback: rotation2, easing: function(x,t,b,c,d){ return c*(t/d)+b; } });}rotation2(); |
演示4 点击旋转
1 2 3 4 5 6 7 8 9 10 11 | $('#img6').rotate({ bind: { click: function(){ $(this).rotate({ angle: 0, animateTo: 180, easing: $.easing.easeInOutExpo }); } }}); |
1 2 3 4 5 6 7 8 9 10 11 | var value2 = 0;$('#img7').rotate({ bind: { click: function(){ value2 +=90; $(this).rotate({ animateTo: value2 }); } }}); |
特别申明:
本站所有资源都是由网友投稿发布,或转载各大下载站,请自行检测软件的完整性!
本站所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!
如有侵权请联系我们删除下架,联系方式:lei1294551502@163.com