Efeito Sobreposto - alguem sabe ?

[ealves 0]

galera quero fazer um seguinte efeito

cuando clicar em um determinado link , me vai abrir uma janela ao estilo popup e a janela de baixo (a que contem o link) vai ficar meio escura como se fosse de segundo plano.

o efeito é mais ou menos o que tem na pagina www.zap.com.br ou ou que tem em algumas paginas da Adobe por exemplo...

 

qdo você clica no link Esqueceu sua Senha da pagina zap se abre uma janela e a de baixo fica em segundo plano meio que escurecida.

isso se usa div e javascript , peguei um codigo feito em dhtml mais nao ta dando certo .

[Otata 4]

cara..tem as frameworks.. DOJO sei que tem esse efeito e outras tbm..da uma olhada...

 

http://dojotoolkit.org/

[DSerma 19]

nao precisa de frameworks...

 

Basta criar uma div com o tamanho total da tela... ai coloca um fundo "transparente" com o CSS ( opacity: .60 )...

 

Depois, cria uma outra div com o contrudo que você qr.... e use o "z-index" para deixar essas duas divs por "cima" da página...

 

Como neste exemplo de uma págin ade envio de e-mail que fiz...

Após o envio do e-mail, ele cria essa div de fundo transparente.. e coloca primeiro um "loading".. e depois a mensagem de enviado...

 

var objBody = document.getElementsByTagName("body").item(0);

		var objOverlay = document.createElement("div");
		objOverlay.setAttribute('id','overlay');
		objOverlay.onclick = function() { document.getElementById("overlay").style.display = "none"; window.location.href = "home.asp" }
		objBody.appendChild(objOverlay);
		
		var divImg = document.createElement("div");
		divImg.setAttribute('id','loading');
		objOverlay.appendChild(divImg);
				
document.getElementById("loading").innerHTML = "<img src = 'ajax-loader(5).gif' border = '0'> <br> Enviando";

O exemplo pode ser conferido em Monlline.com.br, na parte de "Fale Conosco" e "Orçamentos"...

 

 

Abraços...