Heim  >  Artikel  >  Web-Frontend  >  JavaScript-Methode zum Einblenden einer transparenten schwebenden Ebene nach dem Klicken auf die Schaltfläche

JavaScript-Methode zum Einblenden einer transparenten schwebenden Ebene nach dem Klicken auf die Schaltfläche

PHPz
PHPzOriginal
2016-05-16 15:59:481075Durchsuche

Das Beispiel in diesem Artikel beschreibt, wie Sie mithilfe von JavaScript eine transparente schwebende Ebene anzeigen, nachdem Sie auf eine Schaltfläche geklickt haben. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Hier wird die Seite nach dem Klicken grau und mit JS wird ein zentriertes Fenster mit schwebenden Ebenen angezeigt. Dieses Fenster ist transparent und die Transparenz kann eingestellt werden JavaScript-Codes im Internet können Sie daraus lernen.

浮动层居中的对话框效果演示'+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">
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn