JS实现多物体缓冲运动实例代码

效果

思路：利用setInterval计时器进行运动，偏移实现宽度的变动，在用onmouseover将终点和所选中的差异放入参数再进行缓冲运动。代码：复制代码代码如下： head runat=' server ' title/title style type=' text/CSS ' div { width : 100px；高度： 50px背景# 0000FFmargin: 10px}/style脚本类型=' text/JavaScript '窗口。onload=function(){ var Odiv=document。getelementsbytagname(' div ')；for(var I=0；i oDiv.lengthi ) { oDiv[i].定时器=null/给买个差异做个标记，用以关闭相应差异的定时器oDiv[i].onmouseover=function(){ move(this，400)；//给定时器输出参数} oDiv[i].onmouseout=function(){ move(this，100)；} } };函数移动(div，end){ clearInterval(div。计时器)；div。timer=setInterval(function(){ var speed=(end-div。offset withts)/5；//(终点-要走的宽度)/缩放系数=DIV移动的速度速度=速度0?数学天花板（速度):数学地板（速度);//小数取整，也就是进位取整if(div。offsetdth==end){//当到达终点时关闭计时器clearInterval(div。计时器)；} else { div。风格。宽度=div。偏移速度“px”；//移动差异的宽度} },30)}/脚本/head dy/div/div/div/body