jQuery lightBox plugin
September 23rd, 2007. Published under jquery, plugin. 21 Comments.
Diga olá para o jQuery lightBox plugin que é utilizado para exibir imagens na mesma página de forma não-obstrutiva. Utilizando a simplicidade e flexibilidade da jQuery.
Esse plugin teve como inspiração e foi baseado no lightBox 2 criado pelo Lokesh Dhakar.
Veja um exemplo do jQuery lightBox plugin em ação. Veja como é simples e versátil utilizá-lo. Faça o download e comente aí.
21 Comments
Leandro Vieira on September 24th, 2007
Olá Bruno,
Instalei um fórum específico para o jQuery lightBox plugin, vamos discutir essa dúvida por lá?
Crie um post aqui http://leandrovieira.com/forum/viewforum.php?id=2 por favor.
Um abraço.
djcristiano on September 24th, 2007
Gostaria de saber se esse plugin funciona retornando uma página no lugar de uma foto?
Exemplo:
Eu tenho uma lista de produtos, nessa lista tem um link que chama essa pop-up, dentro dela retorna uma busca no banco de dados com os detalhes do produto e foto. Eu tentei fazer com a thickbox, mas o texto com acentos retorna truncado.
aí está o link da página de exemplo: http://www.blogdoiniciante.com/versatil
Leandro Vieira on September 25th, 2007
Djcristiano, o jQuery lightBox plugin funciona apenas com imagens. No momento, não tenho a intenção de extendê-lo para o suporte à páginas.
Um abraço.
ronan on September 25th, 2007
ficou uma bosta, e no ie6 ta dando pau
Leandro Vieira on September 25th, 2007
Ronan,
Disponibilizo meus projetos, scripts e afins com o intuito de agregar valor ao conhecimento de todos nós. No entanto, não espero elogios do tipo: “nossa, ficou maravilhoso”. Também não espero leitores que comentam com falta de educação; sem agregar valor ou tornar a discussão produtiva.
Se o plugin não te satisfez, relate os fatos ou não utilize-o. Se não funcionou, conte como aconteceu o erro. Encontrou algum bug, informe-nos: http://leandrovieira.com/forum/viewtopic.php?id=2
Se você reparar bem, a versão do script é 0.1, o que significa dizer que é uma versão inicial e bugs poderão ser encontrados. Como em qualquer outra script, plugin, software, …
Um abraço.
Raul on October 1st, 2007
Leandro, parabéns pelo plugin!
Só estou com um problema e gostaria de saber se pode me ajudar!
Tenho uma página que utiliza tal plugin e a mesma funciona corretamente no FF e no Opera, mas no IE não, ele não abre o “popup”, apenas vai para uma página com a foto, como se ñ utiliza-se o plugin.
Não sei se tem a ver, mas a página na qual utilizo o plugin é chamada por outra página pelo include, no qual está página chama outra onde utilizo o jQuery, não sei se está dando conflito entre os dois. Ambos utilizam JQuerys diferentes, não o mesmo arquivo!
Enfim, estou postando o link com o fonte da minha página ok.
Leandro Vieira on October 1st, 2007
Olá Raul,
Analisando o código fonte informado, percebi que você chama o plugin lightBox duas vezes em seguida, desta forma, a última chama sobrepõe a segunda.
Exclua a segunda chamada: $(’#produto_img a’).not(’:first’).lightBox(); que está errada. Uma vez que você está excluindo o primeiro link dentro do objeto com ID produto_img e nele há somente um.
Já a primeira chama está correta: $(’#produto_img a:first’).lightBox(); embora possa ser simplificada assim: $(’#produto_img a’).lightBox();
[]´s
Raul on October 2nd, 2007
Leandro, obrigado pela resposta!
Infelizmente fiz as mudanças que você falou e no IE ainda não funciona.
Vou postar a página completa, se puder dar uma olhada…
Algumas partes pode achar estranho, vai haver mais de um cabeçalho, etc…
É pq essas partes são chamadas pelo include, ok.
http://www.zenryo.com.br/lightbox.zip
Abraço!
Raul on October 2nd, 2007
Leandro pude perceber testando aqui, que na verdade ele tenta chamar o popup, mas a imagem abre na tela separada.
Ele aparece bem rapido o fundo preto e aparece a imagem sozinha, não como popup.
Abla on December 12th, 2007
Prezado djcristiano…
Pra fazer isso você usa, no início do seu código:
Asp -
PHP -
Acho que isso ajuda!
Abla on December 12th, 2007
Prezado djcristiano…
Olá Belo tutorial!!!
Pra fazer isso você usa, no início do seu código:
Asp -
PHP -
Acho que isso ajuda!
Abla on December 12th, 2007
Xiii acho que aqui não dá pra colocar codigo rs!
qq coisa me mande um e-mail
abla@designerinterativo.com.br
Miriam de Paula on March 23rd, 2008
Leandro, tudo bom?
Acho o seu plugin maravilhoso! Já o fiz funcionar em dois sites, mas infelizmente no site qu estou trabalhando atualmente (www.lngesso.com.br/teste - Página: Portfólio) o plugin simplesmente não funciona corretamente.
Aquela tela preta “overlay” aparece, mas a foto não! Isso tá acontecendo só no Internet Explorer 6. No IE7 e no Firefox 2, tá funcionando perfeitamente.
Não entendo o porquê! pois recentemente instalei este mesmo plugin no site http://www.graobrasil.com.br e está funcionando numa boa, em todos os browsers!
Amigo, será que você poderia me dar um help? Já não sei mais o que fazer. Sei lá, de repente está tendo algum conflito, mas não sei onde.. E por que só no IE6 ?
Desde já agradeço.
Um grande abraço e aproveitando, desejo uma ótima páscoa pra você!
Beijokas
Miriam de Paula
MSN: tecsite@hotmail.com
Gmail: tecsite@gmail.com
Virgínia on April 8th, 2008
Plugin ninja viu…
Functionou direitinho
Fabio on May 2nd, 2008
Leandro, bom dia,
Então, aquela tela preta de fundo, como a amiga disse, “overlay” não cobre toda page, fica com cerca de 5 pixels sem cobrir… Sabe o que pode estar acontecendo?
Abraços…
Leandro Vieira on May 6th, 2008
Fabio,
É um bug do script. Pretendo corrigir quando tiver condições de lançar uma nova versão.
Abraços.
Max on May 26th, 2008
Fala Leandro, blz?
Eu to com um probleminha bem besta, eu queria mudar, na contagem das imagens, onde aparece (image 1 of 6) para (imagem 1 de 6). procurei no script, mudei algumas coisas mas nao deu certo, pode me dar um help?
Leandro Vieira on May 26th, 2008
Olá Max,
Observe a aba Extend a qual detalha todas as possibilidades de configuração.
Para ser mais preciso, as configurações: txtImage e txtOf.
Abraços.
Max on May 27th, 2008
Bom dia Leandro,
Eu já tentei colocando o script indicado na Extend, mas mesmo assim não funcionou, coloquei na página index.htm, estou usando a ultima versão que vc disponibilizou. O que pode estar errado?
Valeu,
Abraço.
Andy on May 29th, 2008
I really liked your plugin, until I wanted to extend it. But this was not possible due to the cc no-derivates licence. I guess, I’ll go for another script: http://code.google.com/p/jquery-lightbox/
Bruno Ribeiro on September 24th, 2007
como eu faria pra utiliar esse plugin agregado a uma consulta php das imagens q estao no banco??? eu nao tenho muita experiencia com js e to começando a ver esses conceito agora, e achei interessante essa forma d apresentar imagens… se puder me dar uma ajudinha agradeço