jQuery旋转插件—rotate

jQuery旋转插件，支持Internet Explorer 6.0+ 、Firefox 2.0 、Safari 3 、Opera 9 、Google Chrome

rotate(angle)

正值表示顺时针方向旋转，负值表示逆时针方向旋转。

jqueryRotate下载

使用方法：

旋转到指定角度

$("ID").rotate(45);

 <div id="start"><img src="start.png" id="startbtn"></div>
<script type="text/javascript">
    $(function(){
        $("#startbtn").click(function(){
                $(this).rotate({
                duration:3000,                    //持续时间
                angle:0,                        //起始角度
                animateTo:90,                    //结束的角度
                easing:$.easing.easeOutSine,     //定义运动的效果，需要引用jquery.easing.min.js的文件
                callback:function(){            //回调函数
                    alert("结束");
                }
                })
        })
    })
</script>

更多可以测试：http://jsfiddle.net/RwEme/

防止运行时重复点击

<script type="text/javascript">
    $(function()
    {
        clickbtn=false;

        $("#startbtn").live("click",function()
        {
            if(clickbtn==false)
            {
                clickbtn=true;
                var a=Math.floor(Math.random()*360);
                    $(this).rotate(
                {
                    duration:3000,
                    angle:0,
                    animateTo:1000+a,
                    callback:function()
                    {
                        clickbtn=false;
                        alert(clickbtn);
                    }
                })
            }

        })
    })

</script>

应用实例：

幸运大转盘：http://www.helloweba.com/view-blog-215.html