运动框架实现思路
1.速度（改变left，right，width，height，opacity）
2.缓冲运动
3.多物体运动
4.任意值变化
5.链式运动
简单的动画实现效果
1.计时器的设置setInterval,clearInterval
2.offsetLeft属性，可以判断一个物体与document的左边距离，也就是浏览器的左边
3.setInterval(code,millisec)
code是必须的，要调用的函数或者代码块，millisec也是必须的，就是调用的周期！一班、般和clearInterval共同使用，因为如果没有clearInterval 的话是不能停止的
4.clearInterval()方法可以取消setInterval设置的timeout。其参数一定是setInterval()返回的ID值
<script type="text/javascript">
window.onload=function(){//一开始加载的时候
var oDiv=document.getElementById('div1');//获得元素的id
oDiv.onmouseover=function(){
startMove(10,0);//正数代表往前走
}
oDiv.onmouseout=function(){
startMove(-10,-200);//负数代表往后退
}
}
var timer=null;
function startMove(speed,iTarget){
clearInterval(timer);
var oDiv=document.getElementById('div1');
timer=setInterval(function(){//timer为setInterval返回的id值
if (oDiv.offsetLeft==iTarget) {
clearInterval(timer);//达到效果后清除
}else{
oDiv.style.left=oDiv.offsetLeft+speed+'px';//左边的距离不断增加
}
},30)
}
</script>
