Lightbox será?

[Vinícius Siller 0]

Bom dia povo!

Passei um tempinho caçando aqui no fórum e no google alguma coisa sobre lightbox, mas sempre esbarrava em javascripts gigantescos :wacko: .

Td bem, comecei quebrar a cabeça aqui, e montei esse javascript maluco, sei que tem muita, mas muita coisa pra ser melhorado, pois eu não saco nada de javascript. http://forum.imasters.com.br/public/style_emoticons/default/blush.gif

 

O objetivo do script não é substituir o velho ou novo conhecido Lightbox, quem sou eu pra fazer isso, mas sim servir como alternativa, para aqueles desenvolvedores, que desejam colocar de forma simples, uma alerta ou uma página, dentro de um quadrinho personalizado com o fundo da tela ao redor escurecido. :unsure:

 

Testado em: iE7 e FF 2.0.0.14

 

Abaixo vai o código, peço a vcs que avaliem, melhorem, façam o que bem entenderem. Gostaria de saber se esse código serve, se vale apena, se já existe algo parecido, porém melhor. Vamo lá gente participem! http://forum.imasters.com.br/public/style_emoticons/default/clap.gif

 

CODE

<script type="text/javascript">

<!--

function controla_div(id) {

var div_res = document.getElementById(id);

if(div_res.style.display == 'block')

div_res.style.display = 'none';

else

div_res.style.display = 'block';

}

 

function controla_div2(id2) {

var div_res2 = document.getElementById(id2);

if(div_res2.style.display == 'block')

div_res2.style.display = 'none';

else

div_res2.style.display = 'block';

}

//-->

</script>

 

 

<style>

#div01{top:0; left:0;color:000;display:none;position: absolute;width:100%;height:100%;z-index:9998;background-color:#000;-moz-opacity: 0.75;opacity:.75;filter: alpha(opacity=75);}

#div02{position: absolute;top:50%;left:50%;z-index:9999;width:500px;min-height:120px;margin:-220px 0 0 -250px;border:5px solid #F00;background:#FFC6C6;text-align:center; padding:10px; display:none;}

</style>

 

 

 

 

 

 

<div id="div01"></div>

<div id="div02"><a onclick="controla_div('div01'); controla_div2('div02');">FECHAR</a></div>

 

<a onclick="controla_div('div01'); controla_div2('div02');">ABRIR</a>

[nknk 3]

Acho q está faltando uma função para pegar a largura e altura da página para jogar na div com fundo escurecido. Se bem que você pode usar o recurso fixed(position) ao invé.s