ホームページ > 記事 > ウェブフロントエンド > ボタンをクリックした後に透明なフローティングレイヤーをポップアップするJavaScriptメソッド
この記事の例では、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">
【関連チュートリアルの推奨事項】
1. JavaScript ビデオ チュートリアル
2.マニュアル3.
ブートストラップ チュートリアル