Posted in Javascript onDecember 04, 2013
先复制一下,看看运行的效果吧,其中用到的精髓是setInterval()方法:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>JavaScript</title> <style> html { background-color:silver; } .point1 { position:absolute; left:10px; top:40px; } .point2 { position:absolute; left:100px; top:40px; } .hr1 { position:absolute; top:60px; } </style> <script type="text/JavaScript"> document.onmousedown = mousedown; document.onmouseup = mouseup; var intervalProcess; var direct = true; function mousedown(){ intervalProcess = setInterval("MovePoint()", 1); } function mouseup(){ clearInterval(intervalProcess); } function MovePoint(){ with (document.getElementById("point1").style){ if (isNaN(parseInt(left))) left = "10px"; else { document.getElementById("point2").style.left = "200px"; if (parseInt(left) < 0) direct = true; if (parseInt(left) > parseInt(document.getElementById("point2").style.left)) direct = false; if (direct) left = parseInt(left) + 1 + "px"; else left = parseInt(left) - 1 + "px"; } } } </script> </head> <body> <div class="point1" id="point1"><font color=blue>a</font></div> <div class="point2" id="point2"><font color=red>b</font></div> <hr class="hr1" /> </body> </html>
js跑步算法的实现代码
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@