效果:
多广告不冲突、随滚动条移动(一直显示在可视区域)。
floatAD.js
/** * 漂浮广告,兼容IE * 用法:<div id="gg1" style="width:100px;height:100px;background-color:red;color:yellow"> 广告1 </div> * <script type="text/javascript">var ad1=new AdMove("gg1");ad1.Run();</script> * 整理:13:12 2013年7月4日 星期四 */ function addEvent(obj,evtType,func,cap){ cap=cap||false; if(obj.addEventListener){ obj.addEventListener(evtType,func,cap); return true; } else if(obj.attachEvent){ if(cap){ obj.setCapture(); return true; } else{ return obj.attachEvent("on" + evtType,func); } } else{ return false; } } function getPageScroll(){ var xScroll,yScroll; if (self.pageXOffset){ xScroll = self.pageXOffset; } else if (document.documentElement && document.documentElement.scrollLeft){ xScroll = document.documentElement.scrollLeft; } else if (document.body){ xScroll = document.body.scrollLeft; } if (self.pageYOffset){ yScroll = self.pageYOffset; } else if (document.documentElement && document.documentElement.scrollTop){ yScroll = document.documentElement.scrollTop; } else if (document.body){ yScroll = document.body.scrollTop; } arrayPageScroll = new Array(xScroll,yScroll); return arrayPageScroll; } function GetPageSize(){ var xScroll, yScroll; if (window.innerHeight && window.scrollMaxY){ xScroll = document.body.scrollWidth; yScroll = window.innerHeight + window.scrollMaxY; } else if (document.body.scrollHeight > document.body.offsetHeight){ xScroll = document.body.scrollWidth; yScroll = document.body.scrollHeight; } else{ xScroll = document.body.offsetWidth; yScroll = document.body.offsetHeight; } var windowWidth, windowHeight; if (self.innerHeight){ windowWidth = self.innerWidth; windowHeight = self.innerHeight; } else if (document.documentElement && document.documentElement.clientHeight){ windowWidth = document.documentElement.clientWidth; windowHeight = document.documentElement.clientHeight; } else if (document.body){ windowWidth = document.body.clientWidth; windowHeight = document.body.clientHeight; } if(yScroll < windowHeight){ pageHeight = windowHeight; } else{ pageHeight = yScroll; } if(xScroll < windowWidth){ pageWidth = windowWidth; } else{ pageWidth = xScroll; } arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) return arrayPageSize; } var AdMoveConfig=new Object(); AdMoveConfig.IsInitialized=false; AdMoveConfig.ScrollX=0; AdMoveConfig.ScrollY=0; AdMoveConfig.MoveWidth=0; AdMoveConfig.MoveHeight=0; AdMoveConfig.Resize=function(){ var winsize=GetPageSize(); AdMoveConfig.MoveWidth=winsize[2]; AdMoveConfig.MoveHeight=winsize[3]; AdMoveConfig.Scroll(); } AdMoveConfig.Scroll=function(){ var winscroll=getPageScroll(); AdMoveConfig.ScrollX=winscroll[0]; AdMoveConfig.ScrollY=winscroll[1]; } addEvent(window,"resize",AdMoveConfig.Resize); addEvent(window,"scroll",AdMoveConfig.Scroll); function AdMove(id){ if(!AdMoveConfig.IsInitialized){ AdMoveConfig.Resize(); AdMoveConfig.IsInitialized=true; } var obj=document.getElementById(id); obj.style.position="absolute"; var W=AdMoveConfig.MoveWidth-obj.offsetWidth; var H=AdMoveConfig.MoveHeight-obj.offsetHeight; var x = W*Math.random(),y = H*Math.random(); var rad=(Math.random()+1)*Math.PI/6; var kx=Math.sin(rad),ky=Math.cos(rad); var dirx = (Math.random()<0.5?1:-1), diry = (Math.random()<0.5?1:-1); var step = 1; var interval; this.SetLocation=function(vx,vy){ x=vx; y=vy; } this.SetDirection=function(vx,vy){ dirx=vx; diry=vy; } obj.CustomMethod=function(){ obj.style.left = (x + AdMoveConfig.ScrollX) + "px"; obj.style.top = (y + AdMoveConfig.ScrollY) + "px"; rad=(Math.random()+1)*Math.PI/6; W=AdMoveConfig.MoveWidth-obj.offsetWidth; H=AdMoveConfig.MoveHeight-obj.offsetHeight; x = x + step*kx*dirx; if (x < 0){ dirx = 1; x = 0; kx=Math.sin(rad); ky=Math.cos(rad); } if (x > W){ dirx = -1; x = W; kx=Math.sin(rad); ky=Math.cos(rad); } y = y + step*ky*diry; if (y < 0){ diry = 1; y = 0; kx=Math.sin(rad); ky=Math.cos(rad); } if (y > H){ diry = -1; y = H; kx=Math.sin(rad); ky=Math.cos(rad); } } this.Run=function(){ var delay = 10; interval=setInterval(obj.CustomMethod,delay); obj.onmouseover=function(){ clearInterval(interval); } obj.onmouseout=function(){ interval=setInterval(obj.CustomMethod, delay); } } } // end 13:11 2013年7月4日 星期四
<完>