通常在網頁中,一般很難實現多個飄浮廣告一起播放的效果,在此亳州易天科技收集了相關代碼,此JS可以實現1至多個廣告位同時飄浮。
代碼由公共腳本main.js與相關代碼組成,為方便調試,main.j代碼與網頁整合在一起。大家在實際使用時最好將相關JS單獨作成一個文件,然后再引用。-亳州易天科技專業企業網站建設以及基于互聯網應用系統的開發及架設。
實現W3標準多個飄浮廣告代碼效果(易天-小龍收集)
XML/HTML代碼
- <script type="text/javascript">
- <!--
- //公共腳本文件js漂浮廣告代碼(簡潔!) main.js
- function addEvent(obj,evtType,func,cap){
- capcapcap=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;
- }
- //廣告腳本文件 js漂浮廣告代碼(簡潔!) AdMove.js
- /*
- 例子
- <div id="Div2">
- ***** content ******
- </div>
- var ad=new AdMove("Div2");
- ad.Run();
- */
- ////////////////////////////////////////////////////////
- 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;
- xxx = 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);}
- yyy = 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);}
- }
- }
- //-->
- </script>
- <div id="gg1" style="width:100px;height:100px;background-color:red;color:yellow">
- <a href="http://www.xcwdzx.cn/Ynews.asp?type=44"><img src="index/xq.jpg" border="0"></a>
- </