<!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> <div id="box"> </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>
以上就是小编为大家带来的javascript 广告移动特效的实现代码全部内容了，希望大家多多支持查字典教程网~
【javascript 广告移动特效的实现代码】相关文章：