Galeria de Fotos

[Douglas Fabiano 0]

Pessoal instalei a ShadowBox do jquery e consigo fazer abrir uma imagem na lightbox certinho... porem eu queria fazer uma galeria de fotos... quando o usuário clique sobre a foto iria começar a aparecer as outras fotos e não consigo fazer...

 

Veja minha parte do script como está (apenas uma foto):

 

<a href="SobrePousada.jpg" rel="shadowbox"><img src="images/pic2_1_pousada.jpg" alt="" class="pic_left" /></a>

[Patrique 0]

Faz assim, crie um bloco de script e coloque o seguinte

 

algo simples seria fazer assim....

 

<a rel="shadowbox[galeria]" href="imgminiatura1.jpg" title="img 1"><img src="img1grande.jpg" alt="img 1"></a>
<a rel="shadowbox[galeria]" href="imgminiatura2.jpg" title="img 2"><img src="img2grande.jpg" alt="img 2"></a>
<a rel="shadowbox[galeria]" href="imgminiatura3.jpg" title="img 3"><img src="img3grande.jpg" alt="img 3"></a>

 

Note que dentro do valor shadowbox eu especifiquei o nome da galeria

 

shadowbox[galeria]

 

Desta forma é criado uma galeria continua.

 

Mas você poderia fazer algo mas complexo, assim...

 

<script type="text/javascript">
function galeriacarrega() {

   Shadowbox.setup("a.galeria-teste", {
       gallery:        "teste",
       continuous:     true,
       counterType:    "skip"
   });

}
Shadowbox.init({
   overlayOpacity: 0.7
}, galeriacarrega);
</script>

 

Agora substitua isso

 

<a href="SobrePousada.jpg" rel="shadowbox"><img src="images/pic2_1_pousada.jpg" alt="" class="pic_left" /></a>

 

por isso

 

<a class="galeria-teste" href="img1grande.jpg"><img src="img1miniatura.jpg" alt="Img 1"></a>
<a class="galeria-teste" href="img2grande.jpg"><img src="img2miniatura.jpg" alt="Img 2"></a>
<a class="galeria-teste" href="img3grande.jpg"><img src="img3miniatura.jpg" alt="Img 3"></a>

 

[]'s