Ir ao conteúdo
  • Cadastre-se
rami7

Ajuda na imagem do Lightbox

Recommended Posts

Alguém sabe como fazer para postar uma imagem de tamanho reduzida e quando clicar ela se expandir? Estou usando o Lightbox, só que no site só mostra como abrir a imagem através de um link.

Desse jeito

1237747_191842104327151_303258634_n.jpg

Compartilhar este post


Link para o post
Compartilhar em outros sites

Para estes casos eu costumo usar o Fancybox, fácil e rápido de usar.

Segue link do plugin jQuery: http://fancyapps.com/fancybox/

Bom, faça:

1) Inclua a jQuery no seu site, assim (coloque entre as tags <head></head>):


<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

2) Inclua os arquivos do Fancybox no seu site, assim:


<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>

Obs.: Note que você vai precisar baixar 2 arquivos no site do Fancybox, um JS e outro CSS. Coloque na pasta do seu site e depois altere o caminho dos arquivos nos links acima, conforme a organização de pastas do seu site.

3) Agora, imediatamente antes do fechamento da tag </head>, adicione:


$(document).ready(function(){
$('a.fancybox').fancybox();
});

Isso quer dizer: qualquer link(a) com a classe fancybox (.fancybox) vai utilizar o método FANCYBOX (.fancybox())

4) Para funcionar, seu HTML precisa ser assim:


<a href="imagemgrande.jpg" class="fancybox">
<img src="imagempequena.jpg" alt="" />
</a>

Isso quer dizer:

Tenha um link (tag a) cujo endereço leve para a imagem grande e neste link adicione a classe fancybox. Ao clicar nele, o método FANCYBOX entrará em ação e mostrará em forma de lightbox a imagem grande, mesmo que dentro do link tenha uma imagem pequena.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×