Question

我正在为iphone构建一个指南针，呃，只是为了实验目的，并在javascript中学习如何操作，带有phonegap。

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

但我有一个错误：

当车轮从0度变为359度时，一切正常，但当度数再次变为0度时，不是顺时针旋转（顺时针方向），而是逆时针快速旋转到位置0度... < / p>

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

基本上我的问题是找到正确的脚本，以0-360的值开始移动方向盘，我可以从iphone轻松获取。

欢迎任何建议。

Answer 1

当你的体积超过360时翻身。这是一个样本：http://gutfullofbeer.net/rotate.html

[edit]我已经更新了代码来处理逆时针旋转。这是我基于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);
  });

Answer 2

我没有看到任何按钮发表评论...抱歉，但我必须在这里写... 这是我的代码

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

document.getElementById（' mycompass '）。style.webkitTransform =“rotateZ（”+ -deg +“deg）”;

当' mycompass '进入359然后为0时，它会一直旋转...

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

我的错误在哪里？

指南针旋转javascript问题与角度 - 旋转/翻译

2 个答案: