<div class="codetitle"> <span><a style="CURSOR: pointer" data="25138" class="copybut" id="copybut25138" onclick="doCopy('code25138')"><u>复制代</u></a></span> 代码如下:</div> <div class="codebody" id="code25138"> <br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <BR><html xmlns="http://www.w3.org/1999/xhtml"> <br> <br><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <br><title>匀速运動演示</title> <br><style type="text/css"> <br><!-- <br><br>#div1 {幅:1px;高さ:200px;背景色:黒;位置:絶対;左:100px;上:70px;浮動小数点:左} <BR> #div1 スパン {position:absolute;top:-15px} <BR>#div2 {width:1px;height:200px;background-color:midnightblue;position:absolute;left:800px;top:70px;float:left} <BR>#div2 スパン {position:absolute;top:-15px} <BR>#div3 {width:1px;height:200px;background-color:fuchsia;position:absolute;left:300px;top:70px;float:left } <BR>#div3 スパン {position:absolute;top:-15px} <BR>#div4 {width:1px;height:200px;background-color:darkmagenta;position:absolute;left:500px;top:70px;float : left} <BR>#div4 スパン {position:absolute;top:-15px} <BR>#grap {width:200px;height:200px;background:red;position:absolute;left:300px;top:74px;float : left;} <BR>input {width:100px;margin-left: 90px;} <BR>--> <br></style> <br><script type="text/javascript"> <br>var timeId <br>function startMove(target){ <br>var oDiv=document.getElementById('grap') <br>clearInterval(timeId); //この地方は、複数の点の速度上昇を防ぐためのものです、重要 <br>speed=oDiv.offsetLeft<target>timeId=setInterval(function(){ <br>if(Math.abs(oDiv.offsetLeft-target)<=6){ <BR>oDiv.style.left=target 'px'; //只要四角形目标点に直接移動、肉眼無法観察速度変化 <BR>clearInterval(timeId); <BR>} <BR>else; <BR>oDiv.style.left=oDiv.offsetLeft 速度 'px' <BR>} <BR>},30); <BR>} <BR></script> <br></head> <br> <br><div id="div1"><span>100px</span></div> <br><div id="div2"><span>800px</span></div> <br><div id="div3"><span>300px</span></div> <br><div id="div4"><span>500px</span></div> <br><input type="button" value="移動へ100px处" onclick="startMove(100)"/> <br><input type="button" value="移動へ300px处" onclick="startMove(300)"/> <br><input type="button" value="移動到500px处" onclick="startMove(500)"/> <br><input type="button" value="移動到800px处" onclick="startMove(800)"/> <br><div id="grap" ></div> <br><br></body> <br></html> <br></target> </div>
