JavaScript 实现图片向右下方的移动

Question

http://www.scriptlover.com/controls/

Answer 1

用jquery的animate函数就比较简单了

Answer 2

<img id=pic src="" style="position:absolute;">
<script language="javascript">
<!--
var pic=[
"http://case.blueidea.com/files/2009/02/27/work_319926_11548_20090227_160348_9963685_t.jpg",
"http://case.blueidea.com/files/2009/02/27/work_497605_11547_20090227_160345_9151001_t.jpg",
"http://case.blueidea.com/files/2009/02/27/work_213679_11546_20090227_160120_3865967_t.png"
]
var final_x,final_y,element
var stepTime=10;//单步周期
var step=1000;//总步数
var startAdd=0;//步数计数器
var picNum=0;//图片计数器
onload=function(){
element=document.getElementById("pic");
element.src= pic[picNum]
element.style.left=0; 
element.style.top=0; 
var w=element.offsetWidth+30
var h=element.offsetHeight+10
final_x=document.documentElement.offsetWidth-w
final_y=document.documentElement.offsetHeight-h
moveElement() 
}
function moveElement() {
startAdd++
var xpos=parseInt(element.style.left); 
var ypos=parseInt(element.style.top); 

if (startAdd%Math.floor(step/pic.length)==0){picNum=(picNum+1>=pic.length)?0:picNum+1;element.src= pic[picNum]}
if(xpos<final_x) {
element.style.left=startAdd*final_x/step+"px"; 
element.style.top=startAdd*final_y/step+"px"; 
setTimeout("moveElement()",stepTime); 
}
} //-->
</script>