旋转间隔

时间:2012-12-21 08:57:48

标签: javascript jquery rotation transform

  

可能重复:
  Continuous CSS rotation animation on hover, animated back to 0deg on hover out

我想一个正方形不断旋转。我有这段代码:

var gearBig = $('.gear-big');

gearBig.css({
    'transform': 'rotate(42deg)',
    '-moz-transform': 'rotate(42deg)',
    '-o-transform': 'rotate(42deg)',
    '-webkit-transform': 'rotate(42deg)'
});

如何在此代码中添加间隔? gearBig是否连续旋转?

谢谢

2 个答案:

答案 0 :(得分:2)

您可以使用JQuery Rotate

之类的插件

答案 1 :(得分:2)

var deg = 0;

setInterval(rotate_my_big_ass_gear, 100);

function rotate_my_big_ass_gear() {
    $('.gear-big').css({
        'transform': 'rotate(' + (deg++) + 'deg)',
        '-moz-transform': 'rotate(' + (deg++) + 'deg)',
        '-o-transform': 'rotate(' + (deg++) + 'deg)',
        '-webkit-transform': 'rotate(' + (deg++) + 'deg)' //adds 4 on each iteration
    });
}​

FIDDLE