演示1 直接旋转一个角度 $('#img1').rotate(45); 演示2 鼠标移动效果 $('#img2').rotate({ bind : { mouseover : function(){ $(this).rotate({animateTo: 180}); }, mouseout : function(){ $(this).rotate({animateTo: 0}); } } }); 演示3 不停旋转 var angle = 0; setInterval(function(){ angle +=3; $('#img3').rotate(angle); }, 50); var rotation = function (){ $('#img4').rotate({ angle: 0, animateTo: 360, callback: rotation }); } rotation(); 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 点击旋转 $('#img6').rotate({ bind: { click: function(){ $(this).rotate({ angle: 0, animateTo: 180, easing: $.easing.easeInOutExpo }); } } }); var value2 = 0; $('#img7').rotate({ bind: { click: function(){ value2 +=90; $(this).rotate({ animateTo: value2 }); } } });
jQuery旋转插件jquery.rotate.js 让图片旋转
任何事物的某一种状态永远不会一成不变。