本文介绍了js控件div弹出层的实现方法，供大家参考，具体分析如下：

这是一个很好的功能，易于调用和控制弹出层。感兴趣的朋友可以看看效果如何~ O操作（一个_系统）O ~





弹出窗口（可以拖动，背景是灰色和透明的）

<！——
/ *文件名：alertmsg.js
标题：提示标题
内容：说明。
document.write（）
函数$（ID）{ return document.getelementbyid（ID）}
函数的AlertMsg（标题、内容）{
VaR MSGW，信息处理程序，msgbg，msgcolor，边框颜色，titlecolor，titlebg，CON；
分类：确定取消；
弹出窗口设置
MSGW = 300； / /窗口宽度
信息处理程序= 150； / /窗口高度
msgbg =# FFF ； / /内容背景
msgcolor =# 000 ； / /颜色内容
边框颜色=# 000 ； / /边框颜色
titlecolor =# FFF ； / /标题颜色
titlebg =# 369 ； / /标题
掩码设置
无功swidth，sheight；
swidth = screen.availwidth；
sheight = document.body.scrollheight；
创建/掩码背景
无功maskobj = document.createelement（div）；
maskobj.setattribute（'id'，'maskdiv）；
maskobj.style.position =绝对；
maskobj.style.top =0；
maskobj.style.left =0；
maskobj.style.background =# 777 ；
maskobj.style.filter =Alpha（透明度为30）；；
maskobj.style.opacity =0.3；
maskobj.style.width = swidth +PX；
maskobj.style.height = sheight +PX；
maskobj.style.zindex =10000；
document.body.appendchild（maskobj）；
创建一个弹出窗口
无功msbj = document.createelement（div）
msbj.setattribute（身份
msbj.style.position =绝对；
msbj.style.top =（screen.availheight -信息处理程序）/ 4 +PX；
msbj.style.left =（screen.availwidth - MSGW）/ 2 +PX；
msbj.style.width = MSGW +PX；
msbj.style.height =信息处理程序+PX；
msbj.style.fontsize =12px ；
msbj.style.background = msgbg；
msbj.style.border =1px solid+边框颜色；
msbj.style.zindex =10001；
创建/标题
无功thobj = document.createelement（div）；
thobj.setattribute（身份
thobj.classname =状态；
thobj.style.cursor =搬家；
thobj.style.padding =4px 6px ；
thobj.style.color = titlecolor；
thobj.style.background = titlebg；
无功titlestr = 关闭++标题+ ；
thobj.innerhtml = titlestr；
创建内容
无功bodyobj = document.createelement（div）；
bodyobj.setattribute（身份
bodyobj.style.padding =10px ；
bodyobj.style.lineheight =1.5em ；
bodyobj.innerhtml =骗子；
VaR txt = document.createtextnode（内容）
BodyObj.appendChild（TXT）；
创建一个窗口
document.body.appendchild（msbj）；
$（msgdiv ）AppendChild（thobj）；
$（msgdiv ）AppendChild（bodyobj）；
}
功能closemsg（）{
删除对象
document.body.removechild（$（maskdiv ））；
$（msgdiv）。RemoveChild（$（msgth ））；
$（msgdiv）。RemoveChild（$（msgbody ））；
document.body.removechild（$（msgdiv ））；
}
拖动窗口
VaR即= document.all；
无功nn6 = document.getelementbyid！document.all；
无功isdrag = false；
var，x；
无功odrabj；
功能movemouse（e）{
如果（isdrag）{
odrabj.style.top =（nn6 20 + e.clienty Y：20 + event.clienty - y）+PX；
odrabj.style.left =（nn6 NTX + e.clientx X：NTX + event.clientx - x）+PX；
返回false；
}
}
功能initdrag（e）{
无功odraghandle = nn6 e.target：event.srcelement；
无功topelement =HTML；
而（odraghandle.tagname！= topelement odraghandle.classname！=状态）{
odraghandle = nn6 odraghandle.parentnode：odraghandle.parentelement；
}
如果（odraghandle。类名= =状态）{
isdrag =真；
odrabj = odraghandle.parentnode；
20 = parseInt（odrabj。风格。顶部）；
Y = nn6 e.clienty：event.clienty；
NTX = parseInt（odrabj。风格。左）；
x = nn6 e.clientx：event.clientx；
document.onmousemove = movemouse；
返回false；
}
}
document.onmousedown = initdrag；
document.onmouseup =新功能（isdrag =假）；







让我试试。








希望本文能对大家的javaｓｃｒｉｐｔ程序设计有所帮助。