Iniciar o LyteBox a partir de um button

Boa noite a todos,

Esses dias atrás precisei usar o LyteBox em uma tela mas não queria que o mesmo fosse iniciado a partir de um link mapeado para o LyteBox, assim resolvi implementar alguma coisa junto com a biblioteca jQuery para inicializar o LyteBox a partir de um BUTTON normal.

Para que funcionasse do jeito que eu queria, dei umas olhadas pelo código fonte do script e acabei fazendo uma ‘gambiarra’ elegante, ou seja, o LyteBox precisava de um link para ser inicializado normalmente e sem a necessidade de hacks em seu código fonte.

Então a solução tomada ficou ‘óbvia’, criei um link escondido com as configurações do LyteBox nele através do JQuery e depois simulo o click neste link com a função ‘trigger’ do JQuery. No código abaixo tem a implementação da função que eu fiz e que funcionou 100% para a minha necessidade.

[javascript]
this.abre_lytebox = function (id_conta)
{
// Caso não exista um o elemento, cria o mesmo
// e o configura para o LyteBox
if($(‘#id_link_lyteframe’).length <= 0)
{
$(‘<a id=”id_link_lyteframe”></a>’).appendTo(‘body’);
$(‘#id_link_lyteframe’).attr(‘rev’, ‘width: 300px; height: 150px; scrolling: no;’);
$(‘#id_link_lyteframe’).attr(‘rel’, ‘lyteframe’);
$(‘#id_link_lyteframe’).attr(‘href’, ‘modelo/ajax/ajax.php?id=’ + id_conta);
$(‘#id_link_lyteframe’).attr(‘title’, ‘Autenticação’);
$(‘#id_link_lyteframe’).attr(‘style’, ‘display:none;’);
}
// Limpa o conteúdo da DIV criada pelo LyteBox.
$(‘#lbMain’).html(”);
// Instancia o LyteBox para atualizar a referencia aos elementos ‘a’.
var li = new LyteBox();
// Dispara o click no link criado automaticamente.
$(‘#id_link_lyteframe’).trigger(‘click’);
};

[/javascript]

Olhando no código acima, primeiramente eu verifico se já foi criado o link escondido na página, caso não tenha, eu crio o mesmo e já o configuro para funcionar com o LyteBox, depois é necessário limpar a div padrão do Lytebox, no caso a div lbMain.

O próximo passo agora é re-instanciar o objeto LyteBox para que ele atualize a sua lista de elementos ‘a’ aptos a iniciar o efeito.

Por último eu uso a função trigger do JQuery para invocar o click sobre o nosso link escondido.
Espero que tenham gostado, e se caso alguém tiver uma solução melhor fique a vontade para apresentá-la aqui.

Abraços e até a próxima.

Para sugestões, dúvidas, reclamações, utilizem a área de comentários abaixo.