[Resolvido] Como deixar as div's uma debaixo da outra indepen

[Dian Carlos 29]

Olá amigos do iMasters.

 

Tenho um problema que acho que muitos tem também.

 

http://arcoinformatica.com.br/dian/GaleriaImagens/, nesse layout as divs dependendo da altura ficam desordenadas.

 

O que eu quero é que elas fiquem assim:

 

Como eu posso fazer isso?

[Dian Carlos 29]

Resolvido..

[rafael-tdc 13]

Qual a solução? posta aí, pode ser útil para mais pessoas (para mim) :thumbsup:

[Dian Carlos 29]

Qual a solução? posta aí, pode ser útil para mais pessoas (para mim) :thumbsup:

 

Oi rafael.. E depois de muitas pesquisas, achei por acaso o script jQuery Masonry. A documentação, juntamente com o download pode ser feita aqui > http://masonry.desandro.com/

 

Um exemplo de como ficou a minha galeria pode ser vista aqui > http://arcoinformatica.com.br/dian/GaleriaImagens/

Obs.: Não terminei o esquema de clicar e ver as fotos da galeria..

 

No meu caso o código do script ficou assim:

 

<script src="lib/js/jquery/jquery.masonry.min.js"></script>

	<script>
		$(document).ready(function(){

		var $container = $('#uGaleria .caseGaleria');

		$container.imagesLoaded( function(){
 				$container.masonry({
  					 itemSelector: '#galleryThumb',
				 isAnimated: true
 					 });
			});

		});
	</script>

 

E o código das miniaturas ficaram assim:

 

<div id="uGaleria">
               <div class="caseGaleria">

<div id="galleryThumb">
<img src="uGalerias/foto1.jpg">
<span class="galleryTitle">Festa da Cidade</span>
<span class="galleryCount">230 Fotos</span>
<span class="galleryCliks">1.230 Cliques</span>
</div>

<div id="galleryThumb">
<img src="uGalerias/foto2.jpg">
<span class="galleryTitle">Festa da Cidade 2</span>
<span class="galleryCount">230 Fotos</span>
<span class="galleryCliks">1.230 Cliques</span>
</div>

<!-- Ai vai se repetindo por que é dinamico -->


               </div>
           </div>

 

Mas é isso ae..

Qualquer dúvida posta ae..

[rafael-tdc 13]

bacana, assim que der eu vou usar ele :thumbsup:

vlw pelo script