我正在为iPhone制作指南针,du,仅出于实验目的,并学习如何使用JavaScript与phonegap一起使用。
现在我已经可以获取度数了,我可以使用webkit-transform transformZ将deg 0-360应用于div(我们称其为“轮”)(或者我可以使用rotate)
但我有一个错误:
当车轮从0deg到359deg时一切正常,但是当度数再次变为0deg时,与其沿该方向(顺时针方向)平稳旋转,不如沿顺时针方向再次快速旋转至positin 0deg ...
我不知道我很清楚,因为没有示例就很难解释...。
基本上,我的问题是找到合适的脚本来移动轮子(从0-360开始),我可以从iPhone上轻松获得它。
任何建议都欢迎。
最佳答案
大于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);
});