欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

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

程序员文章站 2022-04-21 23:01:42
...
本文实例讲述了JavaScript点击按钮后弹出透明浮动层的方法。分享给大家供大家参考。具体分析如下:

这里实现点击后页面变灰色,并用JS弹出一个居中的浮动层提示窗口,这个窗口是透明的,可以设置透明度,网上已经有很多类似的JavaScript代码,你可以借鉴一下。

浮动层居中的对话框效果演示'+sTitle+
  ((bCancel)?
  '':'')+
  '\n' + sHTML;
 dg.innerHTML = sHTML;
 var dbg = document.createElement("div");
 dbg.id = "nd-bdg";
 dbg.className = "neat-dialog-bg";
 var dgc = document.createElement("div");
 dgc.className = "neat-dialog-cont";
 dgc.appendChild(dbg);
 dgc.appendChild(dg);
 if (document.body.offsetLeft > 0)
 dgc.style.marginLeft = document.body.offsetLeft + "px";
 document.body.appendChild(dgc);
 if (bCancel) document.getElementById("nd-cancel").onclick = function()
 {
  window.neatDialog.close();
 };
 this.elt = dgc;
 window.neatDialog = this;
 }
}
NeatDialog.prototype.close = function()
{
 if (this.elt)
 {
 this.elt.style.display = "none";
 this.elt.parentNode.removeChild(this.elt);
 }
 window.neatDialog = null;
}
function openDialog()
 {
var sHTML = '你现在看到的是一个层窗口,是被JS控制弹出的'+
  '关闭';
 new NeatDialog(sHTML, "你知道吗?", false);
}
" _ue_custom_node_="true">