Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

1sefirot1

[Resolvido] Script de content liquid

Recommended Posts

Galera, bom dia...

 

Alguem por um acaso conhece algum script tipo o desse site aqui:

 

http://www.accxmedia.com/

 

 

Ele distribui as LI's nesse container com scroll.. de maneira uniforme.. como um mosaico..

 

Se eu tiver q fazer isso do zero eu to f***** .. rsrsrs

 

porfavor.. help!

Compartilhar este post


Link para o post
Compartilhar em outros sites

a disposição em mosaico é puro css.

 

não tem muito pra onde fugir.

sabe fazer o css ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara.. sei.. mas vamos la..

 

Quando diz puro css, se entende que vamos flutuar todo mundo pra esquerda por exemplo..

 

Mas repare no site.. nao se sobra espaço de maneira alguma... ele pega as proporções e define os tamanhos de tal maneira que:

 

1 - Se a imagem não casar a proporção com outra, ela ficará completando sozinha um bloco

2 - Se casar a proporção com otra, fica uma em cima da outra..

3 - se uma for mais larga e de menor altura.. fica pequenininha e casa com mais duas abaixo..

 

Entende?

 

nao sei se apenas flutuando resolva nao..

O css deixa "lacunas" vazias, se os diferentes tamanhos de box nao casarem entre si... tipo um quebra cabeça mal feita..

Compartilhar este post


Link para o post
Compartilhar em outros sites

sim, mas olha com o Firebug, o cara usou position: absolute

 

e posicionou cada box na mão. Viu? =)

 

a forma mais tosca e garantida de fazer.

Compartilhar este post


Link para o post
Compartilhar em outros sites

achei.. aqui fala tudo a respeito..

 

Inclusive o comparativo entre flutuar com css e adequar proporções pro encaixe.

 

http://masonry.desandro.com/

 

Veja esse que GENIAL

 

http://masonry.desandro.com/demos/adding-items.html

 

 

Vai adicionando itens e pre-adicionando itens..

 

 

Depois tente redimensionar a janela do navegador..

Compartilhar este post


Link para o post
Compartilhar em outros sites

Se existisse um mundo perfeito, no qual os usuários apenas usassem os navegadores mais recentes, o IE seguisse os padrões do W3C e todos os navegadores já tivessem adotado CSS3, bastaria isto: http://css-tricks.com/13372-seamless-responsive-photo-grid/

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.