帮我分析一下这几个IF里的是怎么计算的?

Question

function moveElement(elementID,final_x,final_y,interval){
var elem = document.getElementById(elementID);
if(elem.movement){
clearTimeout(elem.movement);
}
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){
var dist = Math.ceil((final_x - xpos)/10);
xpos = xpos + dist;
}
if(xpos > final_x){
var dist = Math.ceil((xpos - final_x)/10);
xpos = xpos - dist;
}
if(ypos < final_y){
var dist = Math.ceil((final_y - ypos)/10);
ypos = ypos + dist;
}
if(ypos > final_y){
var dist = Math.ceil((ypos - final_y)/10);
ypos = ypos - dist;
}
elem.style.left = xpos + "px";
elem.style.top = ypos + "px";
var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
elem.movement = setTimeout(repeat,interval);
}
function prepareSlideshow(){
var preview = document.getElementById("preview");
preview.style.position = "absolute";
preview.style.left = "0px";
preview.style.top = "0px";
var list = document.getElementById("linklist");
var links = list.getElementsByTagName("a");
links[0].onmouseover = function(){
moveElement("preview",-110,0,10);
}
links[1].onmouseover = function(){
moveElement("preview",-230,0,10);
}
links[2].onmouseover = function(){
moveElement("preview",-340,0,10);
}
}
addLoadEvent(prepareSlideshow)
if(xpos < final_x){
var dist = Math.ceil((final_x - xpos)/10);
xpos = xpos + dist;
}
if(xpos > final_x){
var dist = Math.ceil((xpos - final_x)/10);
xpos = xpos - dist;
}
if(ypos < final_y){
var dist = Math.ceil((final_y - ypos)/10);
ypos = ypos + dist;
}
if(ypos > final_y){
var dist = Math.ceil((ypos - final_y)/10);
ypos = ypos - dist;
}
这4条IF里面的语句怎么计算的啊.?我的头都大了.
我先来计算下.
第一条IF语句.0小于负110不成立.然后执行到第二条IF语句.
0大于负110条件成立.0减负110等于110,然后除以10等于11,然后赋值给dist变量.
然后0减11等于负11,然后第二次进行循环是怎么样的啊?大家帮我算算...
还有啊.在网页里观察了一次文字的走动形式.刚开始好像速度很快.快到目的地了就变慢了.慢的一小步的走

Answer 1

xpos(当前x坐标)  final_x(最终的x坐标)  1/10(x方向要移动的距离)  新的x坐标
..0  -110  11  -11
-11  -110  10  -21
-21  -110  9.  -30
-30  -110  8.  -38
-38  -110  7.  -45
-45  -110  7.  -52
-52  -110  6.  -60
-60  -110  5.  -65
-65  -110  5.  -70
-70  -110  4.  -74
-74  -110  4.  -78
-78  -110  3.  -81
-81  -110  3.  -84
-84  -110  3.  -87
-87  -110  2.  -89
-89  -110  2.  -91
-91  -110  2.  -93
-93  -110  2.  -95
-95  -110  2.  -97
-97  -110  1.  -98
-98  -110  1.  -99
-99  -110  1.  -100
-100 -110  1.  -101
-101 -110  1.  -102
-102 -110  1.  -103
-103 -110  1.  -104
-104 -110  1.  -105
-105 -110  1.  -106
-106 -110  0.  -106
...不知道有没有排错，不过程序是有问题的，LZ如果也排一下的话就知道了！      

Answer 2

看程序，关键是站在一定高度上去理解代码的意思，不是要具体带数进去运算。我们是让计算机去算，为什么要自己去当奴隶呢？if(当前横坐标 < 目的横坐标){
//当处于目的横坐标左边的时候，向目的横坐标靠拢，变化幅度为距离除以１０。
var dist = Math.ceil((目的横坐标 - 当前横坐标)/10);
//因为距离越来越近，除以１０的结果越来越小，所以变化也越来越慢
当前横坐标 = 当前横坐标 + dist;
}
if(当前横坐标 > 目的横坐标){
//当处于目的横坐标右边的时候，向目的横坐标靠拢，变化幅度为距离除以１０。
var dist = Math.ceil((当前横坐标 - 目的横坐标)/10);
当前横坐标 = 当前横坐标 - dist;
}
if(当前纵坐标 < 目的纵坐标){
//当处于目的纵坐标上边的时候，向目的纵坐标靠拢，变化幅度为距离除以１０。
var dist = Math.ceil((目的纵坐标 - 当前纵坐标)/10);
当前纵坐标 = 当前纵坐标 + dist;
}
if(当前纵坐标 > 目的纵坐标){
//当处于目的纵坐标下边的时候，向目的纵坐标靠拢，变化幅度为距离除以１０。
var dist = Math.ceil((当前纵坐标 - 目的纵坐标)/10);
当前纵坐标 = 当前纵坐标 - dist;
}这个效果，就是当离目标位置越远，就会越快速地向它靠拢，接近时越慢直到停止在目标位置。