点击按钮后弹出透明浮动图层的javascript方法

本文介绍了在javascript点击按钮后弹出透明浮动图层的方法,供大家参考,具体分析如下:

单击此处更改灰色页面,并使用js弹出一个透明透明的浮动层提醒窗口。互联网上有很多类似的Javascript代码,你可以向他们学习。




浮动层对话框效果演示


{ HTML
身高:100%
}
{体
身高:100%
}
{体
FONT-SIZE: 14px;束:宋体,Verdana,无衬线字体
}
{ div.neat-dialog-cont
Z指数:98;背景:没有透明卷0%重复0%;
左:0px;宽度:100%;位置:绝对;顶部:0px;高度:100%
}
{ div.neat-dialog-bg
Z指数:1;过滤器:α(不透明度70);左:0px;
宽度:100%;位置:绝对;顶部:0px;高度:100%;
background-color:# EEE;不透明度:0.7
}
{ div.neat-dialog
border-right:# 555 1px solid 1px solid #硬盘市场关注调查:555;
Z指数:99;margin-left:汽车;border-left:# 555 1px solid;
宽度:30%;margin-right:汽车;border-bottom:# 555 1px solid;
位置:相对;顶:25%;background-color:# FFF
}
{ div.neat-dialog-title
padding-right:0.3em;padding-left:0.3em;FONT-SIZE: 0.8em;
padding-bottom:0.1em;保证金:0px;line-height:1.2em;
padding-top:0.1em;border-bottom:# 444 1px solid;相对位置:
}
{ img.nd-cancel
右:0.2em;位置:绝对;顶部:0.2em
}
div.neat-dialog { p
padding-right:0.2em;padding-left:0.2em;
padding-bottom:0.2em;padding-top:0.2em;text-align:中心
}


功能neatdialog(shtml,stitle,bcancel)
{
window.neatdialog = null;
this.elt = null;
如果(document.createelement文件。getElementById)
{
VaR DG = document.createelement(div);
dg.classname =整洁的对话框;
如果(stitle)
shtml =+ stitle +
(bcancel)
++
' + shtml;
dg.innerhtml = shtml;
VaR DBG = document.createelement(div);
dbg.id =Nd BDG ;
dbg.classname =整洁的对话BG ;
VaR DGC = document.createelement(div);
dgc.classname =整洁的对话内容;
dgc.appendchild(DBG);
dgc.appendchild(DG);
如果(document.body.offsetleft > 0)
dgc.style.marginleft = document.body.offsetleft +PX;
document.body.appendchild(DGC);
如果(bcancel)document.getelementbyid(和取消)。Onclick =功能()
{
Window.neatDialog.close();
};
this.elt = DGC;
这window.neatdialog =;
}
}
neatdialog.prototype.close =功能()
{
如果(这个,英语)
{
this.elt.style.display =没有;
(这this.elt.parentnode.removechild。英语教学);
}
window.neatdialog = null;
}
功能opendialog()
{
VaR shtml =你现在看到的是一层的窗口,通过js弹出控制+
亲密;
新的neatdialog(shtml,你知道吗
}


中间浮层效应
这个演示效果




希望本文能对大家的javascript程序设计有所帮助。