天天看点

漂浮广告代码兼容ie、firefox,多个漂浮不冲突,调用只需两行代码

将广告内容放在div中,设置一个id,然后用下面方法调用

var adcls=new

AdMove("div的id");

adcls.Run();

注意,在调用前要先引用Main.js和AdFloat.js,div也要在调用前写好,原因就不用说了吧

或者也可以用下面方法,在页面加载完成时调用,就不用考虑位置了addEvent(window,"load",initad);

function

initad(){

}

还有两个方法一般情况下没什么用,有兴趣的可以试试,功能是设置漂浮的起始坐标和方向的,如果省掉的话是随机位置随机方向

adcls.SetLocation(x,y)

adcls.SetDirection(dirx,diry)

漂浮广告的斜率是每次碰壁后随机改变的,这样就决不可能出现多个广告,起始位置和方向一致导致其中一个总是被挡住,虽然几率很小

下面是演示

<!DOCTYPE

html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html

xmlns="http://www.w3.org/1999/xhtml"

>

<head><title>wahaha</title>

<meta

http-equiv="Content-Type" content="text/html;charset=gb2312" />

<script

type="text/javascript">

<!--

//公共脚本文件 main.js

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();

}else{

return obj.attachEvent("on" +

evtType,func);

return false;

getPageScroll(){

var xScroll,yScroll;

if (self.pageXOffset) {

xScroll =

self.pageXOffset;

} else if (document.documentElement &&

document.documentElement.scrollLeft){

document.documentElement.scrollLeft;

} else if (document.body) {

document.body.scrollLeft;

if (self.pageYOffset) {

yScroll =

self.pageYOffset;

document.documentElement.scrollTop){

document.documentElement.scrollTop;

document.body.scrollTop;

arrayPageScroll = new

Array(xScroll,yScroll);

return arrayPageScroll;

GetPageSize(){

var xScroll, yScroll;

if (window.innerHeight &&

window.scrollMaxY) {

xScroll = document.body.scrollWidth;

window.innerHeight + window.scrollMaxY;

} else if (document.body.scrollHeight

> document.body.offsetHeight){

document.body.scrollWidth;

yScroll = document.body.scrollHeight;

} else

{

xScroll = document.body.offsetWidth;

document.body.offsetHeight;

var windowWidth, windowHeight;

if

(self.innerHeight) {

windowWidth = self.innerWidth;

windowHeight =

self.innerHeight;

document.documentElement.clientHeight) {

windowWidth =

document.documentElement.clientWidth;

document.documentElement.clientHeight;

} else if (document.body)

windowWidth = document.body.clientWidth;

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)

arrayPageSize;

//广告脚本文件 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(){

winsize=GetPageSize();

AdMoveConfig.MoveWidth=winsize[2];

AdMoveConfig.MoveHeight=winsize[3];

AdMoveConfig.Scroll();

AdMoveConfig.Scroll=function(){

winscroll=getPageScroll();

AdMoveConfig.ScrollX=winscroll[0];

AdMoveConfig.ScrollY=winscroll[1];

addEvent(window,"resize",AdMoveConfig.Resize);

addEvent(window,"scroll",AdMoveConfig.Scroll);

AdMove(id){

if(!AdMoveConfig.IsInitialized){

AdMoveConfig.Resize();

AdMoveConfig.IsInitialized=true;

obj=document.getElementById(id);

obj.style.position="absolute";

W=AdMoveConfig.MoveWidth-obj.offsetWidth;

H=AdMoveConfig.MoveHeight-obj.offsetHeight;

var x = W*Math.random(),y =

H*Math.random();

var rad=(Math.random()+1)*Math.PI/6;

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;

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;

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(){

delay = 10;

interval=setInterval(obj.CustomMethod,delay);

obj.onmouseout=function(){interval=setInterval(obj.CustomMethod,

delay);}

//-->

</script>

</head>

<body>

id="gg1"

style="width:100px;height:100px;background-color:red;color:yellow">

广告1

id="gg2"

style="width:100px;height:100px;background-color:blue;color:yellow">

广告2

id="gg3"

style="width:100px;height:100px;background-color:green;color:yellow">

广告3

var ad1=new

AdMove("gg1");

ad1.Run();

var ad2=new AdMove("gg2");

ad2.Run();

ad3=new

AdMove("gg3");

ad3.Run();

</body>

</html>

继续阅读