JS_任意属性_多物体_缓冲运动

来源：互联网发布：如何在淘宝开店冲q币编辑：程序博客网时间：2024/05/14 22:15

<!DOCTYPE HTML><html><head>  <meta http-equiv="content-type" charset="utf-8" />    <meta http-equiv="content-type" content="text/html" />    <title>demo</title></head><style type="text/css">ul,li,img{margin:0;padding:0;border:0;}#list{height:250px;list-style-type:none;overflow:hidden;}</style><body><div id="odiv" style="position:absolute;width:200px;height:100px;background:red;left:0;border:1px solid #333;"></div><script type="text/javascript">(function(){var odiv=document.getElementById('odiv');odiv.onmouseover=function(){move(this,'width',1000,function(){move(odiv,'left',300,function(){move(odiv,'height',500)})});}function move(obj,arr,target,fn){   //物体，属性,目标值，结束后的动作    clearInterval(obj.dt);    obj.dt=setInterval(function(){    obj.ol=parseInt(obj.style[arr]);    if(obj.ol==target){        clearInterval(obj.dt);        if(fn) fn();    }else{        obj.speed=(target-obj.ol)/8;        obj.speed>0?obj.speed=Math.ceil(obj.speed):obj.speed=Math.floor(obj.speed);        obj.style[arr]=obj.ol+obj.speed+"px";    }    },30);}})()</script></body></html>