awardRotate.js插件制作一个旋转的图片，但是在谷歌浏览器上不是顺时针旋转的,在ie和火狐浏览器是是正常顺时针旋转

莱克星顿的枪声 2017-05-17 07:55:18

代码如下，不知道为什么在谷歌浏览器上不是顺时针旋转的

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

        "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

    <title>Title</title>

    <script type="text/javascript" src="jquery-2.2.4.js"></script>

    <script type="text/javascript" src="awardRotate.js"></script>

    <script>

        $(document).ready(function () {



            var angle = 0;

            setInterval(function(){

                angle+=30;

                //    $("#test2").rotate(angle);

                $("#img01").rotate({

                    angle: angle,

                    duration: 10000,

                    center: [300,300],

                    easing: function (x,t,b,c,d){

                        // t: current time, b: begInnIng value, c: change In value, d: duration

                        return (t/d)*c ; //没有渐变

                    }

                });

            },50);

//绑定对象

            $("#img02").rotate({bind:{

                click: function(){

                    $(this).rotate({

                        angle:0,

                        animateTo:270,

                        duration: 3000,

                        easing: $.easing.easeInOutElastic

                        //  easing: function (x,t,b,c,d){

                        // t: current time, b: begInnIng value, c: change In value, d: duration

// return -c * ( (t=t/d-1)*t*t*t - 1) + b); 默认

                        //return (t/d)*c ; //没有渐变



                        //return c*(t/d)+b;

                        //}

                    });

                    /*   setTimeout(function () {

                     $("#img02").stopRotate();

                     },2000)

                     */

                }

            }

            })

        })



    </script>

</head>



<body>

<div id="demo" >

    <img id="img01" src="tree.jpg" style='width:150px'><br>

    <img id="img02" src="tree.jpg" style='width:150px;left: 500px;position: relative'>

</div>

</body>

</html>