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

下面是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);

调用例子：

标签：