模拟加速和减速代码共享

加速度，即物体移动的速度越来越快的速度；慢运动，即物体运动的速度越来越慢。现在Javaｓｃｒｉｐｔ来模拟这两种效应，其原理是利用setInterval和setTimeout动态改变一个元素与其他元素的距离，如xxx.style.left或xxx.style.marginleft，然后每次运动后能使速度增加，所以加速效应出现，慢动作的原因是一样的。

这里有两个例子：

加速度

复制代码代码如下所示：









Javaｓｃｒｉｐｔ的加速度



*边距：0；填充：0；}

。DIV1 {宽度：100px；身高：100px；背景：# F60的URL（qiuweiguan .gif）没有重复中心；}





函数（id）{ $

返回document.getelementbyid（ID）；

}

在window.onload =函数（）{

VaR的OBTN = $（BTN1 ）；

无功odiv = $（联赛）；

var定时器= null；

var速度= 0；

obtn.onclick =函数（）{

ClearInterval（定时器）；

定时器= setInterval（）{（）函数（

速度+；

odiv.style.marginleft = odiv.offsetleft +速度+PX；

}，30）；

}

}

















注意：在这个例子中，单击后，div块将继续加速到右边的移动。

减速

复制代码代码如下所示：









Javaｓｃｒｉｐｔ的减速运动



*边距：0；填充：0；}

。DIV1 {宽度：100px；身高：100px；背景：# F60的URL（qiuweiguan .gif）没有重复中心；}





函数（id）{ $

返回document.getelementbyid（ID）；

}

在window.onload =函数（）{

VaR的OBTN = $（BTN1 ）；

无功odiv = $（联赛）；

var定时器= null；

var速度= 30；

obtn.onclick =函数（）{

ClearInterval（定时器）；

定时器= setInterval（）{（）函数（

速度—；

odiv.style.marginleft = odiv.offsetleft +速度+PX；

}，30）；

}

}

















注意：在这个例子中，单击后，div块将减速到右边，直到速度降为零，速度变为负值，然后向左加速到左边。