自制弹出式内容框JS代码

//Xingmai命名空间
if(!Xingmai)
var Xingmai = {};

//内容窗口
Xingmai.ContentBox =
{
//创建窗口
CreateBox : function()
{
//创建窗体
var contentBox = {};

//ID
contentBox.ID = null;

//窗口Title
contentBox.Title = null;

//窗口宽度
contentBox.Width = null;

//窗口高度
contentBox.Height = null;

//窗口左像素
contentBox.Left = null;

//窗口顶像素
contentBox.Top = null;

//Class定义
contentBox.ClassName= null;

//默认值
contentBox.Common = {
Width : 500,
Height : 400,
Left : (document.documentElement.clientWidth - contentBox.Width)/2 + document.documentElement.scrollLeft,//有问题
Top : (document.documentElement.clientHeight - contentBox.Height)/2 + document.documentElement.scrollTop //有问题
};
//创建BOX
contentBox.Create = function()
{
//alert("a");
//创建主要界面
var newBox = document.createElement("div");
newBox.setAttribute("id", contentBox.ID);
with(newBox.style)
{
position = "absolute";
zIndex = "9999";
width = contentBox.Width + "px";
height = contentBox.Height + "px";
top = contentBox.Top;
left = contentBox.Left;
}
//newBox.setAttribute("style", "width : " + contentBox.Width + "px; height : " + contentBox.Height + "px;");
if(contentBox.ClassName!=null)
newBox.setAttribute("className", contentBox.ClassName);

//创建标题栏和删除按钮
var titleSpan = document.createElement("div");
with(titleSpan.style)
{
height = "20px";
textAlign = "left";
verticalAlign = "middle";
}
//titleSpan.setAttribute("style", "height : " + "35" + "px;");
titleSpan.setAttribute("class","contentTitleSpan");
var spanDiv = document.createElement("div");
with(spanDiv.style)
{
width = contentBox.Width - 30 + "px";
styleFloat = "left";
textAlign = "left";
}
spanDiv.appendChild(document.createTextNode(contentBox.Title));
titleSpan.appendChild(spanDiv);

var closeDiv = document.createElement("div");
with(closeDiv.style)
{
width = "20px";
styleFloat = "right";
textAlign = "right";
}
var closeButton = document.createElement("a");
closeButton.setAttribute("href", "#");
closeButton.appendChild(document.createTextNode("×"));
$addHandler(closeButton,"click", function(){Xingmai.ContentBox.KillBox(contentBox.ID);});
closeDiv.appendChild(closeButton)
titleSpan.appendChild(closeDiv);
newBox.appendChild(titleSpan);

//创建Iframe
var iframe = document.createElement("iframe");
iframe.setAttribute("class","contentIframe")
iframe.setAttribute("src" , contentBox.Url);
iframe.setAttribute("frameborder","0",0);
iframe.setAttribute("scrolling","no");
with(iframe.style)
{
border = "0";
width = "100%";
height = (contentBox.Height - 20) + "px";
}
newBox.appendChild(iframe);

return newBox;
};

//创建ID
contentBox.CreateID = function()
{
var now = new Date();
return "ContentBox" + now.getFullYear() + now.getMonth() + now.getDay() + now.getHours() + now.getMinutes() + now.getSeconds() + now.getMilliseconds();
};

//显示窗口
contentBox.Show = function()
{
//处理默认值
contentBox.ID = contentBox.ID == null ? contentBox.CreateID() : contentBox.ID;
contentBox.Title = contentBox.Title == null ? "内容系统窗口" : contentBox.Title;
contentBox.Url = contentBox.Url == null ? "about:blank" : contentBox.Url;
if(isNaN(contentBox.Width)||contentBox.Width == null)
contentBox.Width = contentBox.Common.Width;
if(isNaN(contentBox.Height)||contentBox.Height == null)
contentBox.Height = contentBox.Common.Height;
if(isNaN(contentBox.Left)||contentBox.Left == null)
contentBox.Left = contentBox.Common.Left;
if(isNaN(contentBox.Top)||contentBox.Top == null)
contentBox.Top = contentBox.Common.Top;

//创建窗口并显示
var add = contentBox.Create();
document.getElementsByTagName("body").item(0).appendChild(add);
};

return contentBox;
},

//删除窗口
KillBox : function(id)
{
var box= document.getElementById(id);
if(box)
box.parentNode.removeChild(box);
}
};
posted @ 2008-06-20 21:04 提示符 阅读(...) 评论(...) 编辑 收藏