JavaScriptで実装されたポップアップレイヤーエフェクトコード オブジェクト指向 way_js オブジェクト指向

js のオブジェクト指向の性質について言えば、js の組み込み属性について言及する必要があります (注: ここでのプロトタイプは、prototype.js ではありません)。その機能は、ある種のプロパティを動的に追加することです。オブジェクトをプロパティに変換します。今私がしなければならないことは、継承などのコードをできるだけ公開することです。プロトタイプについて詳しくない場合は、関連するコンテンツを検索してください。

今日私がやりたいことは、HTML 要素をクリックしてフレンドリーなダイアログ ボックスをポップアップすることです。まず、2 つの点を明確にする必要があります。1 つは、この方法を頻繁に使用する可能性があるということです。 2 番目のポイントは、ポップアップのコンテンツを可能な限り多様にし、カスタマイズすることもできることです。これら 2 つの点を明確にしたら、js コードを書くことができます。これらはすべて非常に初歩的なことです。私を軽蔑したい場合は、遠慮なく軽蔑してください。 ^.^

最初に単純なオブジェクトを定義します:

コードをコピーします コードは次のとおりです:

function objDIV() {
this.bgdiv;
this.infodiv;
}

まず、マスク レイヤーをポップアップします。 openBackDiv(); という名前を付けます。

コードをコピーします コードは次のとおりです:

function openBackDiv(txbdiv) {
txbdiv.bgdiv = document.createElement("div");
txbdiv.bgdiv.setAttribute("id", "overDiv"); = "";

}

さらに、定義したばかりのオブジェクトのプロトタイプ (openBG()):

コードをコピー コードは次のとおりです:

objDIV.prototype.openBG = function() {
openBackDiv(this);
this.bgdiv.style.display = "ブロック" ;
this.bgdiv.style.width = document.documentElement.clientWidth "px";
this.bgdiv.style.height = document.documentElement.scrollHeight "px"; >
次に、ポップアップ情報レイヤーを追加します。方法は上記と同じです。これが非常に基本的なことであると述べたのはそのためです。特に言うことはないようなので、コードにアクセスしてください。

これは読み込みポップアップ レイヤーですが、少し荒いです

コードをコピーします

コードは次のとおりです。 🎜> function openLoadDiv(txbdiv) { txbdiv.infodiv = document.createElement("div"); txbdiv.infodiv.setAttribute("id", "div_info"); >txbdiv .infodiv.innerHTML = "

お待ちください 待機中、処理中...

"; document.body.appendChild(txbdiv.infodiv);