L'arrière-plan de la couche pop-up implémentée par javascript est grisé - simulation (boîte de dialogue easyui)

La page est plutôt moche et seules les fonctions sont implémentées. ^ ^

Copiez le code comme suit :

<title>Imiter l'effet de la boîte de dialogue easyui</title>

<script>

//Obtenir les éléments de la page

var getElement = fonction() {

return document.getElementById(arguments[0]) || false;

}

fonction openDialog(dialogId) {

var masqueId = "masque";

// S'il y en a un, supprimez d'abord celui d'origine

si (getElement(dialogId)) {

document.removeChild(getElement(dialogId));//Opération de suppression : div contextuel

}

si (getElement(maskId)) {

document.removeChild(getElement(maskId));//Opération de suppression : couche (masque) contextuelle inutilisable

}

//Le fond est grisé

var masqueDiv = document.createElement("div");

masqueDiv.id = masqueId;

maskDiv.style.position = "absolu" ;

masqueDiv.style.zIndex = "1";

maskDiv.style.width = document.body.scrollWidth + "px";

maskDiv.style.height = document.body.scrollHeight + "px";

masqueDiv.style.top = "0px";

masqueDiv.style.left = "0px";

maskDiv.style.background = "gris";

maskDiv.style.filter = "alpha(opacité=10)";

maskDiv.style.opacity = "0.30";//Transparence

document.body.appendChild(maskDiv);//Ajouter un calque d'arrière-plan au corps

//Dialogue

var dialogDiv = document.createElement("div");

dialogDiv.id = dialogId;

dialogDiv.style.position = "absolu" ;

dialogDiv.style.zIndex = "9999";

dialogDiv.style.width = "400px";

dialogDiv.style.height = "200px";

dialogDiv.style.top = (parseInt(document.body.scrollHeight) - 200) / 2 + "px" // Centrer l'écran ;

dialogDiv.style.left = (parseInt(document.body.scrollWidth) - 400) / 2 + "px" // Centrer l'écran ;

dialogDiv.style.background = "blanc";

dialogDiv.style.border = "1px gris uni";

dialogDiv.style.padding = "5px";

dialogDiv.innerHTML = "(Contenu de la boîte de dialogue)";

//Fermer l'opération dans Dialog : fermer le calque d'arrière-plan et le calque de dialogue

var closeControlloer = document.createElement("a");//Créer un lien hypertexte (comme déclencheur de fermeture)

closeControlloer.href = "#";

closeControlloer.innerHTML = "Fermer";

closeControlloer.onclick = fonction() {

document.body.removeChild(getElement(dialogId));//Supprimer le diaglog

document.body.removeChild(getElement(maskId));//Supprimer le calque d'arrière-plan

}

dialogDiv.appendChild(closeControlloer);//Ajouter une opération "fermer" à la boîte de dialogue

document.body.appendChild(dialogDiv);//Ajouter une boîte de dialogue au corps

}

</script>

<a href="#" onclick="openDialog('dialog');">Ouvrir la boîte de dialogue</a>