Plugin DivBox

Criei esse Plugin jQuery para abrir uma Div como um LightBox

Para usar o Plugin é bem simples. Siga os passos abaixo:

Segue o link do DEMO

1. Adicione ele a div que precisa do efeito: Esse efeito será acionado assim que a página for carregada.

OBS: A div precisa estar oculta, usando um display: none; no CSS

$(function(){
 $("#teste").divbox();
});

2. Segue a documentação abaixo:

2.1: Para adiconar cor ao fundo da máscara use o parâmetro "cor":

$(function(){
 $("#teste").divbox({
 color: "#C33"
 });
});

OBS: A Cor default do plugin é "#000″ (Preto)

2.2: Para aumentar a diminuir a opacidade da máscara use o parâmetro "opacidade": (DICA: "de 0.1 a 0.9″)

$(function(){
 $("#teste").divbox({
 opacity: 0.5
 });
});

OBS: Por padrão a Opacidade é "0.8″

2.3: Para retirar o link de fechar da máscara, mude o parâmetro "fecharFundo" para false:

$(function(){
 $("#teste").divbox({
 clickBackground: false
 });
});

2.4: Para adicionar uma funcionalidade de fechar a máscara em algum elemento da página, basta passar o ID ou Class do elemento para o parâmetro "fechar":

$(function(){
 $("#teste").divbox({
 close: "#fechar"
 });
});

<div id="teste">
 <h2>Minha Div atual.</h2>
 <br />
 <a href="javascript:;" id="fechar">Clique aqui para fechar!</a>
</div>

2.5: O DivBox já vem com uma div default centralizada, mais você pode otimizar, colocando o estilo de sua div dentro do plugin. Para isso, use uma classe

$(function(){
 $("#teste").divbox({
 class: "div_teste"
 });
});

Veja o Código completo e o exemplo:

$(function(){
$(function(){
 $("#clicar").click(function(){
 $("#teste").divbox({
 color: "#C33",
 opacity: 0.9,
 clickBackground: false,
 close: "#fechar"
 });
 });
});
});

Segue o link do DEMO