如何反轉動畫？

Question

我想在第二次單擊后從上，左到下，右反轉動畫。

function myMove() {
  var elem = document.getElementById("animate");   
  var pos = 0;
  var id = setInterval(frame, 5);
  function frame() {
    if (pos == 350) {
      clearInterval(id);
    } else {
      pos++; 
      elem.style.top = pos + "px"; 
      elem.style.left = pos + "px"; 
    }
  }

}

Answer 1

像這樣？

您也可以更改點擊的切換

 var toggle = true function myMove() { var elem = document.getElementById("animate"); var pos = 0; var id = setInterval(frame, 5); function frame() { if (pos >= 350 || pos < 0) toggle = !toggle // remove this to use an event handler pos += (toggle ? 1 : -1) elem.style.top = pos + "px"; elem.style.left = pos + "px"; } } myMove() 

 #animate { position: absolute } 

 <div id="animate">*</div>