javascript - 在循环中使用 JS 和 CSS 更改对象的旋转

Question

我正在尝试使图像在无限循环中的 2 个位置之间更改其旋转。这些是我的两个职位：

logo.style.webkitTransform = "rotate(3deg)"
logo.style.webkitTransform = "rotate(-3deg)"

有人可以帮助我创建延迟并将其放入循环中。到目前为止，我所有的努力都没有奏效。（我正在尝试使用 while 循环 + setTimeout）

或者有更好的方法吗？

提前致谢

Answer 1

试试这个，看看是否有效

var dir = false;

setInterval(function(){
    (dir == false) ? logo.style.webkitTransform = "rotate(3deg)" : logo.style.webkitTransform = "rotate(-3deg)";
    dir = !dir;
}, 2000);

Answer 2

您可以将它们放入 setInterval() JavaScript 函数中：

var currentDeg = 3;

function changeRotation(deg){
    logo.style.webkitTransform = "rotate("+deg+"deg)";
    currentDeg = deg;
}

function setDeg(){
  if(currentDeg == 3){
    changeRotation(-3);
  } else {
    changeRotation(3);
  }
}

setInterval(setDeg(), 500);

高温高压