本文实例讲述了JavaScript拖拽、碰撞、重力及弹性运动实现方法。分享给大家供大家参考，具体如下：
js拖拽、碰撞与重力实现代码：
=document.documentElement.clientHeight-oDiv.offsetHeight)
{
iSpeedY*=-0.8;
iSpeedX*=0.8;
t=document.documentElement.clientHeight-oDiv.offsetHeight;
}
else if(t<=0)
{
iSpeedY*=-1;
iSpeedX*=0.8;
t=0;
}
if(l>=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弹性运动实现代码：
rush: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程序设计有所帮助。
原文地址：https://www.jb51.cc/js/50663.html
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
