幻灯片功能(moveElement函数)

来源:互联网 发布:手机制作报纸软件 编辑:程序博客网 时间:2024/06/03 11:36

elementID:打算移动的元素的id

 final_x:该元素的目的地的“左”位置

 final_y:该元素的目的地的“上”位置

nterval:两次移动之间的停顿时间

function moveElement(elementID,final_x,final_y,interval) {    if(!document.getElementById) return false;    if(!document.getElementById(elementID)) return false;    //elem对应着想移动的任何元素    var elem=document.getElementById(elementID);    //把变量movement从一个全局变量改变为正在被移动的那个元素(elem元素)的属性。就可以测试它是否已经存在,并在它已经存在的情况下使用clearTimeout    if(elem.movement){        clearTimeout(elem.movement);    }    //如果这两个属性没有被设置,我将把它们默认值设置为0    if(!elem.style.left){        elem.style.left="0px";    }    if(!elem.style.top){        elem.style.top="0px";    }    //left、top转为数值,赋值给xpos和    var xpos=parseInt(elem.style.left);    var ypos=parseInt(elem.style.top);    //检查给定元素是否已经到达目的地    var dist=0;    if(xpos==final_x&&ypos==final_y){        return true;    }    if(xpos<final_x){        // xpos++;         //如果xpos小于final_x,给它加1        dist=Math.ceil((final_x-xpos)/10);        xpos=xpos+dist;    }    if(xpos>final_x){        // xpos--;    //如果大于final_x,给它减1        dist=Math.ceil((xpos-final_x)/10);        xpos=xpos-dist;    }    if(ypos<final_y){        // ypos++;          //如果ypos小于final_y,给它加1        dist=Math.ceil((final_y-ypos)/10);        ypos=ypos+dist;    }    if(ypos>final_y){        //ypos--;   //如果大于final_y,给它减1        dist=Math.ceil((ypos-final_y)/10);        ypos=ypos-dist;    }    //负责把字符串“px”追加到变量xpos和ypos末尾,并将其赋值给elem元素的left和top属性    elem.style.left=xpos+"px";    elem.style.top=ypos+"px";    var repeat="moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";    // movement=setTimeout(repeat,interval);    elem.movement=setTimeout(repeat,interval);}



0 0
原创粉丝点击