弹性运动+摩擦力+清除定时器+修正误差

陆康永

于 2015-04-27 10:18:52 发布

阅读量734

点赞数 1

分类专栏： miaov运动学之弹性运动及碰撞运动

本文链接：https://blog.csdn.net/xiaomogg/article/details/45306765

版权

miaov运动学之弹性运动及碰撞运动专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<style type="text/css">
#box{width:100px;height:100px;background:red;position: absolute;left:0;}
span{height:900px;border-left:1px red solid;position: absolute;left:500px;}
</style>
<title></title>
<script type="text/javascript">
window.οnlοad=function()
{
var oInput=document.getElementById("input1");
var oDiv=document.getElementById("box");
var timer=null;
oInput.οnclick=function()
{
startMove();
};
function startMove()
{
clearInterval(timer);
var iSpeed=0;
timer=setInterval(function()
{
iSpeed+=(500-oDiv.offsetLeft)/50;
iSpeed*=0.95;
if(Math.abs(iSpeed)<=1&&Math.abs(500-oDiv.offsetLeft)<=1)
{
clearInterval(timer);//清除定时器，减少资源耗费
oDiv.style.left="500px";//修正误差
iSpeed=0;
}
oDiv.style.left=oDiv.offsetLeft+iSpeed+"px";
},30)
}
}
</script>
</head>
<body>
<input type="button" value="开始运动" id="input1"/>
<div id="box"></div>
<span></span>
</body>
</html>