1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 2 "http://www.w3.org/TR/html4/strict.dtd"> 3 4 <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 7 <title>10.浮动广告</title> 8 <meta name="author" content="Administrator" /> 9 <!-- Date: 2014-12-15 --> 10 <style> 11 *{margin:0;padding:0} 12 #div1{width:100px;height:100px;position:absolute;background:red;left:0;top:0} 13 #line{width:1px;height:500px;background:#000000;position:absolute;left:500px;} 14 </style> 15 <script> 16 window.onload=function(){ 17 var oDiv1=document.getElementById('div1'); 18 var timer=null; 19 var iSpeedX=10; 20 var iSpeedY=10; 21 timer=setInterval(function(){ 22 var L=oDiv1.offsetLeft + iSpeedX; 23 var T=oDiv1.offsetTop + iSpeedY; 24 oDiv1.style.left = L +'px'; 25 oDiv1.style.top = T +'px'; 26 27 if( T > document.documentElement.clientHeight - oDiv1.offsetHeight ){ 28 T = document.documentElement.clientHeight - oDiv1.offsetHeight; 29 iSpeedY *= -1; 30 }else if( T<0 ){ 31 T=0; 32 iSpeedY *= -1; 33 } 34 35 if( L > document.documentElement.clientWidth - oDiv1.offsetWidth ){ 36 L = document.documentElement.clientWidth - oDiv1.offsetWidth; 37 iSpeedX *= -1; 38 }else if( L<0 ){ 39 L=0; 40 iSpeedX *= -1; 41 } 42 43 44 },30) 45 } 46 </script> 47 </head> 48 <body> 49 <div id="div1"></div> 50 </body> 51 </html>