[Resolvido] Código para fazer um layout ter "altura" multipl

Joarley Rodrigues · Dezembro 23, 2011

Olá pessoal.

Sou desenvolvedor de templates para web mas quando se fala em javascript eu peco e muito ainda e venho aqui pedir uma ajudinha para vocês mais entendidos do assunto.

Vamos lá:

Estou desenvolvendo um template q tem uma borda (que imita um selo de carta), eu fatiei em 4 pedaços, fazendo o topo, as 2 laterais e a base. as imagens das bordas laterais tem 46 pixel de altura e se repetem do topo até atingir a base, no topo fica tudo perfeito, mas quando atinge a base, devido a variação de altura do total da página na maioria das vezes acontece de não encaixar as figuras na base, tornando o template feio esteticamente.

Pensei em algo que calculasse a altura total da página e em um determinado lugar dentro do layout (ex: entre o conteúdo e o rodapé) fazer com que a margem que separem essas 2 partes arredondasse para mais ou para menos para que na base do layout as imagens se encaixassem perfeitamente.

Será que alguém daqui do fórum seria capaz de me ajudar???

O site ainda não está no ar, segue imagem para entender melhor o que está acontecendo.

Muito obrigado.

Joarley Rodrigues

Editado Janeiro 16, 2012 por Joarley Rodrigues

lucas.js · Dezembro 23, 2011

Talves isso funcione:

seudiv=document.getElementById("seu_div");
altura=seudiv.offsetHeight;
seudiv.style.height=(Math.ceil(altura/46)*46)+"px"

Isso faz com que o elemento tenha uma altura múltiplo de 46px.

Mas teste com o Internet Explorer.

Geralmente ele atribui outros valores para altura diferentes dos outros navegadores.

Editado Dezembro 24, 2011 por lucas.js

Joarley Rodrigues · Dezembro 26, 2011

Olá Lucas, muito obrigado pela resposta...

Como eu disse eu não sou muito habituado com scripts, quando uso já vem tudo pronto...

Para usar esse código que você me passou, tenho q colocar dentro da tag <script> certo? E inserir o código no <head> do arquivo html?

O "seudiv" e "seu_div" é o nome da div que eu quero que regule a altura dai tenho que substituir do seu código pelo em uso em <body>?

Desculpe a dúvida de iniciante. mas minha meta é em breve iniciart o estudo de programação de scripts...

Abráços!!!

lucas.js · Dezembro 26, 2011

pode colocar no final de body mesmo.

e seu_div é o ID do div em questão.

Joarley Rodrigues · Janeiro 16, 2012

Muito Obrigado Lucas,

Agora que fui tentar mecher, futuquei de várias formas até que consegui.

o que mais pegou foi o fato de ter trocado o valor 46px que na verdade é a largura, a altura de cada imagem é 71px. Quando vi isso matei o problema na hora.

Outro detalhe foi ter que espepcificar as div´s com altura fixa deixando somente uma (a que o codigo ia agir) para deixar o template sem quebra de imagem..

Muito obrigado.

Entrar

[Resolvido] Código para fazer um layout ter "altura" multipl

Pergunta

Joarley Rodrigues

Link para o comentário

Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

lucas.js

Link para o comentário

Compartilhar em outros sites

Joarley Rodrigues

Link para o comentário

Compartilhar em outros sites

lucas.js

Link para o comentário

Compartilhar em outros sites

Joarley Rodrigues

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades