1

我正在为 iphone 构建一个指南针，duh，只是为了实验目的，并学习如何在 javascript 中使用 phonegap 进行操作。

现在我已经能够获得度数，我能够使用 webkit-transform translateZ（或者我可以使用旋转）将 deg 0-360 应用于 div（我们称之为“轮子”）

但我有一个错误：

当车轮从 0 度转到 359 度时，一切正常，但是当度数再次变为 0 度时，它不是顺时针方向平稳旋转，而是再次逆时针快速旋转到 0 度位置...

我不知道我很清楚，因为没有例子不容易解释......'

基本上我的问题是找到正确的脚本来移动从值 0-360 开始的轮子，我可以从 iphone 轻松获得。

欢迎任何建议。

4

2 回答 2

1

当你大于 360 时翻滚。这是一个示例： http: //gutfullofbeer.net/rotate.html

[编辑] 我更新了处理逆时针旋转的代码。这是我的基于 jQuery 的 Javascript 的样子：

  $(function() {
    var rotator = function(class, inc) {
      var degrees = 0;
      return function() {
        $('.' + class)
          .css({'-webkit-transform': 'rotate(' + degrees + 'deg)'})
          .css({'-moz-transform': 'rotate(' + degrees + 'deg)'})
          ;
        degrees += inc;
        if (degrees > 360) degrees -= 360;
        if (degrees < 0) degrees += 360;
      };
    };
    setInterval(rotator('clockwise', 2), 33);
    setInterval(rotator('counter-clockwise', -2), 33);
  });
于 2010-02-27T17:13:59.310 回答
1

我没有看到任何可以发表评论的按钮...对不起，但我必须在这里写...这是我的代码

deg是 iphone 给我的值，它可以是 0 到 360。

document.getElementById(' mycompass ').style.webkitTransform = "rotateZ("+ -deg +"deg)";

当 ' mycompass ' 达到 359 然后 0 时，它会一直旋转回来......

在你的例子中，我可以有大于 360 的值，所以它对我不起作用......

我的错误在哪里？

于 2010-02-27T21:05:04.777 回答