是obj.style.WebkitTransform =“rotate（”+ degree +“deg）”; 非常精准？

Question

当我以1度的小度值检查它时，旋转功能是不是完全准确？

因为我注意到了，我的计算结果是正确的，但是物体有可能倾斜一点点或更少。

我使用js-control-css旋转创建一个1小时的倒计时时钟，但它有一些机会略微错位，而计算的值是正确的。 http://jsbin.com/exIFAPIS/1/ （您可以调整javascript开头的开始时间，称为“sendTime”）

任何人可以帮助我或给出一些提示或可能的原因吗？

非常感谢！

Answer 1

首先，令人敬畏的计时器萌芽！

整个过程非常好，事实上我真的很想解决你的问题只是为了让它完美运行。

问题是旋转只有一定程度的关闭。 这似乎很小，但实际上旋转属性可行的误差很大。 否则，在日常应用中很容易辨别。 如基本的90度和180度变换。 181-179是一个很大的区别。

为了说明这一点，请查看这个小提琴：

http://jsfiddle.net/agconti/x8PFL/1/

HTML：

<div id="div-1"><p>reference text</p></div>
<div id="div-2"><p>reference text</p></div>
<div id="div-3"><p>reference text</p></div>
<div id="div-4"><p>reference text</p></div>

CSS：

div { 
    width: 100px; 
    height:100px; 
    border: 1px solid black; 
    display:inline-block;
}
p{ margin: 25%; text-decoration:underline;}
#div-2 {
    -webkit-transform: rotate(179deg);
    -moz-transform: rotate(179deg);
    transform: rotate(179deg);
}

#div-3 {
    -webkit-transform: rotate(181deg);
    -moz-transform: rotate(181deg);
    transform: rotate(181deg);
}
#div-3 {
    -webkit-transform: rotate(181deg);
    -moz-transform: rotate(181deg);
    transform: rotate(181deg);
}
#div-3 {
    -webkit-transform: rotate(181deg);
    -moz-transform: rotate(181deg);
    transform: rotate(181deg);
}
#div-4 {
    -webkit-transform: rotate(179.8deg);
    -moz-transform: rotate(179.8deg);
    transform: rotate(179.8deg);
}

你可以看到，即使在div-4也存在一定程度的失真（也就是说它不是完全直的）。 这意味着rotate属性相当精确，最多可达1位小数

（如果你把它带到179.9deg小数点后+/- 1）。 那么回答你的第一个问题; 是的，rotate属性精确到至少1度。

因为你的例子在大约0.5度（在通过眼睛调整之后）关闭了，所以你的计算似乎必须关闭而不是旋转属性，因为0.5度完全在属性的容差范围内。[1]

[1]（STD +/- 1度 - > 5度是标准偏差的5倍，（当然，这是松散的））。

我不排除你的计算累积舍入可能导致错误，考虑到测试似乎不太可能。 如果检查数学并且仍然遇到错误，为了防止精度损失，可以将十进制计算作为整数，并将结果除以转换值。