标签：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> .box2{} .box2{width: 200px; height: 200px; background: red; border-radius: 50%;position: relative;} .box3{width: 800px; height: 500px; border:1px solid red;} </style> </head> <body> <button type="" id="start">开始</button> <button type="" id="stop">停止</button> <div class="box3"> <div id="box" class="box2"> </div> </div> </body> <script type="text/javascript"> var lr=600; var tb=300; var i=0; var j=0; var box=document.getElementById(‘box‘); var start=document.getElementById(‘start‘); var stop=document.getElementById(‘stop‘); start.onclick=function(){ start.style.display=‘none‘; stop.style.display=‘inline‘; var time=setInterval(function(){ box.style.left=i+‘px‘; box.style.top=j+‘px‘; if (i>lr) { lr=0; i--; } if(i<=lr){ lr=600; i++; } if (j>tb) { tb=0; j--; } if (j<=tb) { tb=300; j++ } stop.onclick=function(){ clearInterval(time); stop.style.display=‘none‘; start.style.display=‘inline‘; } },5); } </script> </html>
标签：
原文地址：http://www.cnblogs.com/qiwuyan/p/5615065.html
