尝试使用jQuery控制css3转换命令旋转div元素

基本上，我得到的是一个计时器，每半秒计算一次，并且它应该更新程度，div应该旋转到新的程度。 最终的结果应该（理论上）是一个有点平滑的不断旋转的div。

可悲的是，它旋转1度，然后程度不会再次更新，即使根据控制台日志，数字仍在计数。

有什么建议？

setInterval(function() { var i = 0; i++; $('#nav').css({'-webkit-transform' : 'rotate(' + i + 'deg)'}); console.log(i); } , 1000); 

谢谢！

Answer 1

每次调用该函数时，您都将变量i设置为零：

 var i = 0; 

…然后加一个。

 i++; 

所以它总是“1”。 您需要将该值存储在其他位置，或者每次从css属性解析它，然后添加一个。 以下是前一个解决方案的示例：

 var rotate_degrees = 0; setInterval(function() { rotate_degrees++; $('#nav').css({'-webkit-transform' : 'rotate(' + rotate_degrees + 'deg)'}); console.log(rotate_degrees); } , 1000); 

有什么不同之处在于声明变量在函数范围之外而不是在内部。

Answer 2

变量i是函数的本地变量，因此它始终为1.将名称更改为rotationCount并将其全局声明（例如，在所有函数之外）

此外，您将需要进行modula 360算术。