对js动画和时间控制的使用

// JavaScript Document
//打算移动的元素ID；elementID
//该元素的目的地的"左"位置；final_x;
//该元素的目的地的"上"位置；final_y;
//停顿时间；interval;

function moveMessage(elementID,final_x,final_y,interval){
    if(!document.getElementById) return false;
    if(!document.getElementById(elementID)) return false;
    var elem = document.getElementById(elementID);
    if(elem.movement){
        clearTimeout(elem.movement)//防止多次运行运行moveMessage，导致代码堵塞，这样可以停止一下未完成的代码
    }
    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 ){
        dist =Math.ceil((final_x-xpos)/10);
        xpos=dist+xpos;
    }
    if(xpos > final_x){
        dist =Math.ceil((xpos-final_x)/10);
        xpos=xpos-dist;
    }
    if(ypos < final_y){
        dist =Math.ceil((final_y-ypos)/10);
        xpos=dist+ypos;
    }
    if(ypos > final_y){
        dist =Math.ceil((ypos-final_y)/10);
        xpos=ypos-dist;
    }
    elem.style.left = xpos +"px";
    elem.style.top = ypos +"px";
    var repeat = "moveMessage('"+elementID+"',"+final_x+","+final_y+","+interval+")"//'"+elementID+"'这里的单引号不可以少非数值变量
    elem.movement  = setTimeout(repeat,interval); //这里的movement必须是全局变量因为，刚开始clearTimeout(elem.movement)会找不到报错
}