Js广告_全屏漂浮广告

 1 <!DOCTYPE HTML>
 2 <html lang="en">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <title>Js广告_全屏漂浮广告</title>
 6 <style type="text/css">
 7 div#roll{width:100px;height:100px; background-color:#000; color:#fff; position:absolute;}
 8 </style>
 9 </head>
10 
11 <body>
12 <div id="roll">我是广告</div>
13 <script type="text/javascript">
14 var ggRoll = {
15     roll : document.getElementById("roll"),
16     speed : 20,
17     statusX : 1,
18     statusY : 1,
19     x : 100,
20     y : 300,
21     winW : document.documentElement.clientWidth - document.getElementById("roll").offsetWidth,
22     winH : document.documentElement.clientHeight - document.getElementById("roll").offsetHeight,
23     Go : function(){
24         this.roll.style.left=this.x+'px';
25         this.roll.style.top=this.y+'px';
26          
27         this.x = this.x + (this.statusX? -1: 1)
28         if(this.x < 0) {this.statusX = 0}
29         if(this.x > this.winW) {this.statusX = 1}
30          
31         this.y = this.y + (this.statusY? -1: 1)
32         if(this.y < 0) {this.statusY = 0}
33         if(this.y > this.winH) {this.statusY = 1}
34     }
35 }
36 var interval = setInterval("ggRoll.Go()", ggRoll.speed);
37 ggRoll.roll.onmouseover = function(){clearInterval(interval)};
38 ggRoll.roll.onmouseout = function(){interval = setInterval("ggRoll.Go()", ggRoll.speed)};
39 
40 </script>
41 
42 
43 </body>
44 </html>