JS多物体 任意值 链式 缓冲运动
发布时间:2020-12-14 23:32:16 所属栏目:资源 来源:网络整理
导读:复制代码 代码如下: !DOCTYPE HTML html head meta http-equiv="content-type" charset="utf-8" / meta http-equiv="content-type" content="text/html" / titledemo/title /head style type="text/css" ul,li,img{margin:0;padding:0;border:0;} #list{heig
复制代码 代码如下: <!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"> var odiv=document.getElementById('odiv'); odiv.onmouSEOver=function(){ move(this,'width',500,function(){ move(odiv,'left',300,'height','borderWidth',10) }) })});} function move(obj,arr,target,fn){ var dt=null,speed=0,ol=0; clearInterval(dt); dt=setInterval(function(){ ol=parseInt(obj.style[arr]); if(ol==target){ clearInterval(dt); if(fn) fn(); }else{ speed=(target-ol)/8; speed>0?speed=Math.ceil(speed):speed=Math.floor(speed); obj.style[arr]=ol+speed+"px"; } },30); } </script> </body> </html> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |