HTML

<img src="images/chrome.png" width="256" height="256"/>

演示一、旋转45度

$('#img1').rotate({angle: 45});

演示二、鼠标悬浮和离开旋转动画效果

$("#img2").rotate({
    bind: {
        mouseover: function() {
            $(this).rotate({
                animateTo: 180
            });
        },
        mouseout: function() {
            $(this).rotate({
                animateTo: 0
            });
        }
    }
});

演示三、每50毫秒自动旋转

var angle = 0;
setInterval(function() {
    angle += 3;
    $("#img3").rotate(angle);
},
50);

演示四、360度循环旋转

var rotation = function() {
    $("#img4").rotate({
        angle: 0,
        animateTo: 360,
        callback: rotation
    });
}
rotation();

演示五、360度旋转回调

var rotation2 = function() {
    $("#img5").rotate({
        angle: 0,
        animateTo: 360,
        callback: rotation2,
        easing: function(x, t, b, c, d) { // t: current time, b: begInnIng value, c: change In value, d: duration
            return c * (t / d) + b;
        }
    });
}
rotation2();

演示六、点击旋转一

$("#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
            })
        }
    }
});