本文实例讲述了javascript拖拽、碰撞、重力及弹性运动实现方法。分享给大家供大家参考，具体如下：
js拖拽、碰撞与重力实现代码：
window.onload=function (){ var odiv=document.getelementbyid('div1'); var lastx=0; var lasty=0; odiv.onmousedown=function (ev) { var oevent=ev||event; var disx=oevent.clientx-odiv.offsetleft; var disy=oevent.clienty-odiv.offsettop; document.onmousemove=function (ev) { var oevent=ev||event; var l=oevent.clientx-disx; var t=oevent.clienty-disy; odiv.style.left=l+'px'; odiv.style.top=t+'px'; ispeedx=l-lastx; ispeedy=t-lasty; lastx=l; lasty=t; document.title='x:'+ispeedx+', y:'+ispeedy; }; document.onmouseup=function () { document.onmousemove=null; document.onmouseup=null; startmove(); }; clearinterval(timer); };};var timer=null;var ispeedx=0;var ispeedy=0;function startmove(){ clearinterval(timer); timer=setinterval(function (){ var odiv=document.getelementbyid('div1'); ispeedy+=3; var l=odiv.offsetleft+ispeedx; var t=odiv.offsettop+ispeedy; if(t>=document.documentelement.clientheight-odiv.offsetheight) { ispeedy*=-0.8; ispeedx*=0.8; t=document.documentelement.clientheight-odiv.offsetheight; } else if(t=document.documentelement.clientwidth-odiv.offsetwidth) { ispeedx*=-0.8; l=document.documentelement.clientwidth-odiv.offsetwidth; } else if(l<=0) { ispeedx*=-0.8; l=0; } if(math.abs(ispeedx)<1) { ispeedx=0; } if(math.abs(ispeedy)<1) { ispeedy=0; } if(ispeedx==0 && ispeedy==0 && t==document.documentelement.clientheight-odiv.offsetheight) { clearinterval(timer); alert('停止'); } else { odiv.style.left=l+'px'; odiv.style.top=t+'px'; } document.title=ispeedx; }, 30);}
js弹性运动实现代码：
var left=0; //用left变量存储赋给obj.style.left的值，以防每次系统都省略小数，所导致最后结果的细微差异var ispeed=0;function startmove(obj,itarget){ clearinterval(obj.timer); obj.timer=setinterval(function(){ ispeed+=(itarget-obj.offsetleft)/5; //速度 ispeed*=0.7; //考虑阻力 left+=ispeed; if(math.abs(ispeed)<1&&math.abs(itarget-obj.offsetleft)<1) //停止条件 速度和距离绝对值小于1 { clearinterval(obj.timer); obj.style.left=itarget+px; //清楚后，顺便把目标值赋给obj.style.left } else { obj.style.left=left+px; } },30);}
更多关于javascript运动效果相关内容可查看本站专题：《javascript运动效果与技巧汇总》
希望本文所述对大家javascript程序设计有所帮助。