利用脚本封装,方便实现网站悬浮广告

王朝html/css/js·作者佚名  2008-05-20
窄屏简体版  字體: |||超大  

下面是JS脚本(floatdiv.js)

/*======================================================================

浮动块支持脚本

DESIGN BY : 彭国辉

DATE:

2004-02-26

SITE:

http://kacarton.yeah.net/

EMAIL:

kacarton@sohu.com

======================================================================*/

var alLeft = 0, alCenter = 1, alRight = 2; //水平对齐方式

var alTop = 0, alMiddle = 1, alBottom = 2; //垂直对齐方式

var f = new Array();

var cnt = 0;

function floatDiv(objId, align, vAlign, x, y, smooth)

{

/*浮动块对象

数据结构:

objId: 对象ID

align: 水平对齐方式,枚举型

vAlign:垂直对齐方式,枚举型内容

x, y: xy座标,整型

smooth:平滑移动,布尔型

*/

this.objId = objId;

this.align = align;

this.vAlign = vAlign;

this.x = x;

this.y = y;

this.smooth = smooth;

}

function addDiv(objId, align, vAlign, x, y, smooth)

{ //添加浮动块

f[cnt++] = new floatDiv(objId, align, vAlign, x, y, smooth);

}

function floatMove()

{ //重新定位各块位置

var objX, objY;

if (document.all)

{

var d = document.body;

//status = "scrollLeft:"+f[0].objId.style.pixelTop+"| offsetWidth:"+d.offsetWidth;

for (var i=0; i<f.length; i++)

{

switch (f[i].align)

{

case alLeft : objX = d.scrollLeft + f[i].x; break;

case alCenter: objX = d.scrollLeft + Math.ceil((d.offsetWidth - f[i].objId.offsetWidth)/2) + f[i].x; break;

case alRight : objX = d.scrollLeft + d.offsetWidth - f[i].x - f[i].objId.offsetWidth - 20; break; //减滚动条20

}

switch (f[i].vAlign)

{

case alTop : objY = d.scrollTop + f[i].y; break;

case alMiddle: objY = d.scrollTop + Math.ceil((d.offsetHeight - f[i].objId.offsetHeight)/2) + f[i].y; break;

case alBottom: objY = d.scrollTop + d.offsetHeight - f[i].y - f[i].objId.offsetHeight; break;

}

if (f[i].smooth) smoothMove(f[i].objId, objX, objY);

else

{

f[i].objId.style.pixelLeft = objX;

f[i].objId.style.pixelTop = objY;

}

}

}

if (document.layers)

{

for (var i=0; i<f.length; i++)

{

var objId = f[i].objId;

switch (f[i].align)

{

case alLeft : objX = pageXOffset + f[i].x; break;

case alCenter: objX = pageXOffset + Math.ceil((window.innerWidth-objId.width)/2) + f[i].x; break;

case alRight : objX = pageXOffset + window.innerWidth - f[i].x - document.objId.width; break;

}

switch (f[i].vAlign)

{

case alTop : objY = pageYOffset + f[i].y; break;

case alMiddle: objY = pageYOffset + Math.ceil(window.innerHeight/2) + f[i].y; break;

case alBottom: objY = pageYOffset + window.innerHeight - f[i].y - document.objId.height; break;

}

if (t[i].smooth) smoothMove(f[i].objId, objX, objY);

else

{

document.objId.left = objX;

document.objId.top = objY;

}

}

}

setTimeout("floatMove();",50);

}

function smoothMove(obj, x, y)

{

var percent;

if (document.all)

{

percent = .1 * (x - obj.style.pixelLeft);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

obj.style.pixelLeft += percent;

percent = .1 * (y - obj.style.pixelTop);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

obj.style.pixelTop += percent;

}

if (document.layers)

{

percent = .1 * (x - document.objId.left);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

document.objId.left += percent;

percent = .1 * (y - document.objId.top);

if (percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent);

document.objId.top += percent;

}

}

setTimeout("floatMove();",50);

调用例子:

<script language="javascript" src="lib/floatdiv.js"></script>

<script language="javascript">

if (navigator.appName == "Netscape")

{

document.write("<layer id=ad_hr top=300 width=100 height=120><a href=http://www.fpc.org.cn/hr/040522.htm target=_blank><img src='ad/hr40522.gif' width=120 height=180 border=0></a></layer>");

}

else

{

document.write("<div id=ad_hr style='position: absolute;width:120;top:300;left:5;visibility: visible;z-index: 1'><a href=http://www.fpc.org.cn/hr/040522.htm target=_blank><img src='ad/hr40522.gif' width=120 height=180 border=0></a></div>");

}

addDiv(ad_hr, alRight, alTop, 0, 30, true);

</script>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航