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>
