Question

就像标题一样，我想在我的网页上制作图像或div旋转。而且，我在谷歌代码中找到了jqueryrotate.js http://code.google.com/p/jqueryrotate/ 本作者如何使用jqueryrotate.js中的函数使其工作，并在jsfiddle中给出一些示例，它看起来很棒！但当它转向我时，无论我如何尝试复制作者的代码，它都不起作用，图像只是保持静态。我不知道它有什么问题，希望有人能给予帮助。

我写的代码如下：

<html>
<head>
<scripttype="text/javascript"src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>
<script type="text/javascript">
    var rotation = function (){
    $(document).ready(function(){
    $("#img").rotate({
      angle:0, 
      animateTo:360, 
      callback: rotation,
      easing: function (x,t,b,c,d){        // t: current time, b: begInnIng value, c: change In value, d: duration
          return c*(t/d)+b;
      }
     });
    }
    rotation();

    })
    </script>
</head>
<body>
<img style="margin:10px;"src="/arrow.png" id="img">
</body>
</html>

Answer 1

你的脚本包含在html中有一个拼写错误：

<scripttype="text/javascript"src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>

应该是

<script type="text/javascript" src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>

而不是包含脚本类型

的脚本

Answer 2

您的代码有一些错误。试试这个。

var rotation = function (){

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

$(document).ready(function(){
rotation();

});

http://jsfiddle.net/TRQKE/

当然，您还需要更正Joe提到的脚本标记。并且您需要包含jquery本身，它不包含在您的代码示例中：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

关于div＆amp; amp;图像通过jquery旋转360度

2 个答案: