O plano de fundo da camada pop-up implementada por javascript está esmaecido - simulação (caixa de diálogo easyui)

A página é bastante feia e apenas funções são implementadas. ^ ^

Copie o código do código da seguinte forma:

<title>Imite o efeito da caixa de diálogo easyui</title>

<roteiro>

//Obtém os elementos da página

var getElement = function() {

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

}

função openDialog(dialogId) {

var mascaraId = "máscara";

//Se houver, exclua o original primeiro

if (getElement(dialogId)) {

document.removeChild(getElement(dialogId));//Operação de exclusão: div pop-up

}

if (getElement(maskId)) {

document.removeChild(getElement(maskId));//Operação de exclusão: camada pop-up inoperável (máscara)

}

//O fundo fica acinzentado

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

máscaraDiv.id = máscaraId;

maskDiv.style.position = "absoluto";

máscaraDiv.style.zIndex = "1";

máscaraDiv.style.width = document.body.scrollWidth + "px";

máscaraDiv.style.height = document.body.scrollHeight + "px";

máscaraDiv.style.top = "0px";

máscaraDiv.style.left = "0px";

maskDiv.style.background = "cinza";

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

maskDiv.style.opacity = "0,30";//Transparência

document.body.appendChild(maskDiv);//Adiciona uma camada de fundo ao corpo

//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" // Centraliza a tela;

dialogDiv.style.left = (parseInt(document.body.scrollWidth) - 400) / 2 + "px" // Centraliza a tela;

dialogDiv.style.background = "branco";

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

dialogDiv.style.padding = "5px";

dialogDiv.innerHTML = "(Conteúdo da caixa de diálogo)";

//Fechar operação no Diálogo: fecha a camada de fundo e a camada do Diálogo

var closeControlloer = document.createElement("a");//Cria um hiperlink (como gatilho para fechamento)

closeControlloer.href = "#";

closeControlloer.innerHTML = "Fechar";

closeControlloer.onclick = function() {

document.body.removeChild(getElement(dialogId));//Excluir diaglog

document.body.removeChild(getElement(maskId));//Remove a camada de fundo

}

dialogDiv.appendChild(closeControlloer); //Adiciona operação "fechar" ao diálogo

document.body.appendChild(dialogDiv);//Adiciona diálogo ao corpo

}

</script>

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