<style type="text/css">
div{border:1px solid #ccc;}
#a{width:500px;height:500px;position:relative;}
#b{width:100px;height:100px;position:absolute;}
</style>
<script type="text/javascript">
function movelement(elementId, final_x, final_y, interval){
if(!document.getElementById(elementId)){ return false; }
var element = document.getElementById(elementId);
if(!element.style.top){
element.style.top = 0;
}
if(!element.style.left){
element.style.left = 0;
}
xpos = parseInt(element.style.top);
ypos = parseInt(element.style.left);
if(xpos == final_x && ypos == final_y){
return true;
}
if(xpos < final_x){
var dlist = Math.ceil((final_x - xpos)/10);
xpos = xpos + dlist;
}
if(xpos > final_x){
var dlist = Math.ceil((xpos - final_x)/10);
xpos = xpos - dlist;
}
if(ypos < final_y){
var dlist = Math.ceil((final_y - ypos)/10);
ypos = ypos + dlist;
}
if(ypos > final_y){
var dlist = Math.ceil((ypos - final_y)/10);
ypos = ypos - dlist;
}
element.style.top = xpos + "px";
element.style.left = ypos + "px";
var repeat = "movelement('" + elementId + "'," + final_x + "," + final_y + "," + interval + ")";
var mov = setTimeout(repeat, 20);
}
</script>
</head>
<div id="a">
<div id="b">bbbbb</div>
</div>
<script type="text/javascript">
movelement("b", 200, 200, 20);
</script>
本文转自豪情博客园博客，原文链接：http://www.cnblogs.com/jikey/archive/2010/04/14/1711792.html，如需转载请自行联系原作者
