js中的缓冲运动

缓冲运动的效果，就是对象的速度越来越小

缓冲运动的原理：速度由距离决定，速度=（目标值-当前值）/缩放比例

可能遇到的bug：没有对速度取整，导致对象的运动不能够精确的到达目标值，切记对速度进行取整运算

<script>
window.onload = function() {
	var oBtn = document.getElementById('btn');
	var oDiv1 = document.getElementById('div1');
	oBtn.onclick = function(){
		clearInterval(oDiv1.timer);
		oDiv1.timer = setInterval(function(){
			//缓冲运动的处理
			iSpeed = (500 - oDiv1.offsetLeft)/8;
			iSpeed = iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);/*//当目标点比初始点大的时候，我们对速度向上取整，当目标点比初始点小的时候，我们对速度进行向下取整，这么做是因为js在计算obj.offsetLeft/obj.offsetTop的时候会对小数进行四舍五入计算，所以运动到最后的时候可能会出现对象还没达到目标点就停止了运动*/
			
			if(oDiv1.offsetLeft == 500){
				clearInterval(oDiv1.timer);
				alert(oDiv1.offsetLeft);
				}else{
					oDiv1.style.left = oDiv1.offsetLeft + iSpeed +'px';
					}
			},30);
		}
	
	
}
</script>