El fondo de la capa emergente implementada por javascript está atenuado: simulación (diálogo easyui)

La página es bastante fea y solo se implementan funciones. ^ ^

Copie el código de código de la siguiente manera:

<title>Imita el efecto del diálogo easyui</title>

<guión>

//Obtener elementos de la página

var getElemento = función() {

devolver document.getElementById(argumentos[0]) || falso;

}

función openDialog(dialogId) {

var máscaraId = "máscara";

//Si hay uno, borra primero el original.

if (getElement(dialogId)) {

document.removeChild(getElement(dialogId));//Operación de eliminación: div emergente

}

if (getElement(máscaraId)) {

document.removeChild(getElement(maskId));//Operación de eliminación: capa emergente (máscara) inoperable

}

//El fondo está atenuado

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

máscaraDiv.id = máscaraId;

maskDiv.style.position = "absoluto";

maskDiv.style.zIndex = "1";

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

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

maskDiv.style.top = "0px";

maskDiv.style.left = "0px";

maskDiv.style.background = "gris";

maskDiv.style.filter = "alfa(opacidad=10)";

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

document.body.appendChild(maskDiv);//Agregar una capa de fondo al cuerpo

//Diálogo

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

dialogDiv.id = dialogId;

dialogDiv.style.position = "absoluto";

dialogDiv.style.zIndex = "9999";

dialogDiv.style.width = "400px";

dialogDiv.style.height = "200px";

dialogDiv.style.top = (parseInt(document.body.scrollHeight) - 200) / 2 + "px" // Centrar la pantalla;

dialogDiv.style.left = (parseInt(document.body.scrollWidth) - 400) / 2 + "px" // Centrar la pantalla;

dialogDiv.style.background = "blanco";

dialogDiv.style.border = "1px gris sólido";

dialogDiv.style.padding = "5px";

dialogDiv.innerHTML = "(Contenido del cuadro de diálogo)";

//Cerrar operación en Diálogo: cerrar la capa de fondo y la capa de Diálogo

var closeControlloer = document.createElement("a");//Crear un hipervínculo (como activador para el cierre)

closeControlloer.href = "#";

closeControlloer.innerHTML = "Cerrar";

closeControlloer.onclick = función() {

document.body.removeChild(getElement(dialogId));//Eliminar cuadro de diálogo

document.body.removeChild(getElement(maskId));//Eliminar la capa de fondo

}

dialogDiv.appendChild(closeControlloer);//Agregar operación "cerrar" al diálogo

document.body.appendChild(dialogDiv);//Agregar diálogo al cuerpo

}

</script>

<a href="#" onclick="openDialog('dialog');">Abrir cuadro de diálogo</a>