Javascript DOM 编程艺术 Chap10 动画效果

最新推荐文章于 2024-09-17 13:42:29 发布

Bingersoda

最新推荐文章于 2024-09-17 13:42:29 发布

阅读量229

点赞数

分类专栏： when i come across it 文章标签： javascript 动画开发语言

本文链接：https://blog.csdn.net/Bingersoda/article/details/121067469

版权

when i come across it 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

问题：

1.setTimeout（）中前者忘记加引号，一直无法运行。

2.依然是setTimeout，也是引号问题，如下

var repeat = "moveElement('"+ElmentId+"',"+final_x+","+final_y+","+interval+")"
  movement = setTimeout(repeat,interval);

为什么要把ElementId扩起来？

可运行的代码：


function moveElement(ElmentId,final_x,final_y,interval){
  var elem = document.getElementById(ElmentId);
  var xpos = parseInt(elem.style.left);
  var ypos = parseInt(elem.style.top);

  if(xpos == final_x && ypos == final_y){
    return true;
  }
  if(xpos < final_x){
    xpos++;
  }
  if(xpos > final_x){
    xpos--;
  }
  if(ypos < final_y){
    ypos++;
  }
  if(ypos > final_y){
    ypos--;
  }

  elem.style.left = xpos +"px";
  elem.style.top = ypos + "px";

  var repeat = "moveElement('"+ElmentId+"',"+final_x+","+final_y+","+interval+")"
  movement = setTimeout(repeat,interval);
}

function positionMessage(){
  var elem = document.getElementById("woo");
  elem.style.left = "50px";
  elem.style.top = "50px";
  moveElement("woo",200,100,10);
}

window.onload = positionMessage();

问题解决参考答案：关于dom编程艺术动画部分一句代码的解释问题-前端-CSDN问答