Script para equilibrar colunas

[qim]

Olá

tenho um script nest página

http://pintotours.ne...ublic/Turq.html

que entre outras coisas faz com que as colunas laterais fiquem com a mesma altura da parte central.

(function() {'use strict';
function init(){var outside=document.getElementById('outside');var
outside2=document.getElementById('outside2');var
inside=document.getElementById('inside');
var
hgt=[outside.offsetHeight,outside2.offsetHeight,inside.offsetHeight];hgt=(Math.max(hgt[0],hgt[1],hgt[2]));
outside.style.height=outside2.style.height=inside.style.height=hgt+'px';
if(window.name=='newwindow')
{if(document.getElementById('name')){document.getElementById('name').style.display='';}outside.style.display='none';outside2.style.display='none';inside.style.width='820px';document.getElementById('popup-test').innerHTML='<h3><a
href="#">Close<\/a><\/h3>'+'<h4><\/h4>'+'<h3><a
href="PuntaCana.html" target="top"><\/a><\/h3>';var
anc=document.getElementById('popup-test').getElementsByTagName('a');for(var
c=0;c<anc.length;c++) {anc[c].onclick=function()
{window.close();return false;}}}}
window.addEventListener?window.addEventListener('load',init,false):window.attachEvent('onload',init);
})();

Gostaria de aplicar esse script (modificado) para conseguir o mesmo nesta página

http://pintotours.ne...k/BALI/bali.php

Agradeço a vossa ajuda pois os meus conhecimentos javescript são praticamente nulos!

MAIS TARDE...

esqueci-me de acrescentar que o porblema só surge com a entrada das media queries entre 800px e 550px

Edited March 17, 2015 at 03:46 PM by qim

[KTachyon]

Cheira-me que podias fazer isso só com CSS. Se a outer div tiver uma altura do conteúdo central, basta dizeres que as divs laterais têm 100%.

[qim]

Aleluia! Até que enfim que alguém mostra interesse. Muito obrigado.

Bem, eu já tentei de duas maneiras: Esta do script; e simplemanete colocando o #footer entre as queries 800 e 550. O problema aí é que a coluna central tem position:absolute; que foi a única maneira de ela não cair para debaixo da coluna esquerda.

Já perdi quase todos os poucos cabelos que tinha... e qualquer ajuda será bemvinda e muito apreciada.

Comprendo também que a página são remendos atrás de remendos, o que não ajuda; mas o "projecto" é adaptar esta página e não começar de novo.

MAIS TARDE:

Dizias:" basta dizeres que as divs laterais têm 100%."

O problema é que à medida que o ecrã reduz em largura o conteúdo central aumenta em altura...

Eu mudei a cor da coluna esquerda para ser a mesma do fundo para que com uma evntual #Footer não se notasse que a coluna não tinha a altura adequada.

MAIS TARDE

Por issso, o script seria uma melhor solução, se funcionasse...

Só agora vejo que não deve funcionar. Na página onde funciona o conteúdo central não se estica para baixo, não muda de altura. O script simplesmente adapta-se à altura fixa do conteúdo. A não ser que haja outro tipo de js script rmágico...

Muito obrigado. Fico à espera...

Edited March 17, 2015 at 05:47 PM by qim

[KTachyon]

O problema é que estás a tentar controlar muita coisa dentro de uma div. Se separasses o conjunto de colunas numa só div facilitavas a gestão das três colunas, em vez de teres que lidar com os header, o footer, o menu,...

[bioshock]

Não consigo ver aplicabilidade de um ficheiro javascript para fazer o que pretendes, pelo que consegui compreender da tua questão.

#left
{
  height: 100%;
}

.panel3left
{
  position: relative;  
  top: 0;
}

Edited March 17, 2015 at 05:53 PM by bioshock

[HappyHippyHippo]

Aleluia! Até que enfim que alguém mostra interesse. Muito obrigado.

talvez para a próxima coloques o tópico no local correcto, isto está muito longue de ser Java ...v

Edited March 17, 2015 at 05:56 PM by HappyHippyHippo

[qim]

Começando por

HappyHippYHippo

Mil desculpas!

Mas agora é css...

bioshock

O problema ñão está na coluna ou nas panel, está no facto de que não consigo colocar o #footer para andar para cima e para baixo acampanhando o conteúdo, O primero porblema está na position:absolute; do conteúdo. Se conseguir modificar isso sem perder o conteudo quando estreito o ecrã, é maio caminho andado. Se conseguir isso as colunas laterais não t~em imortância pois dei-lhes a cor do fundo e não se notará se estão curtas.

KTachyon

Se compreendo o que queres dizer devo envolver tudo #left, #right, "#content num só div, por exemplo div . container, masd isso já existe, só que não está a ser utilizado

Já dei tantas voltas que não sei onde começar.

Edited March 17, 2015 at 06:14 PM by qim

[qim]

Desculpem estas mudanças de ideias.

Decidi colocar a #footer de novo entre 800px and 550px (media queries), mas o conteúdo mergulha por debaixo dela, em vez de a empurrar para baixo.

O problema parece-me é que #content tem position:absolute;. Se eu retirar isso o conteúdo cai quando entra nas media queries. O que posso fazer para retirar position:absolute e fazer com que a div fique quietinha?

Agradecia que me vissem este ponto. A partir de aí já devo resolver o resto.

Obrigado

Edited March 17, 2015 at 07:23 PM by qim

[KTachyon]

Tu podes colocar todos os scripts mágicos que quiseres. Se não souberes como funcionam vais ter sempre problemas com eles e vais estar sempre a pedir que te ajudem.

Para adaptares coisas com um script que, no teu caso específico, aplica as dimensões fixas para o estado actual, tens que o mandar recalcular sempre que há uma mudança de dimensões da janela. Se o fizeres com CSS não precisas de o fazer. As coisas vão ser calculadas automaticamente pelo browser. Daí a minha sugestão de ser melhor optares por utilizar CSS antes de pensares numa solução Javascript para tudo o que seja relacionado com a apresentação.

Quanto ao footer, vais precisar de ser mais específico com aquilo que queres dizer com "mergulha por debaixo dela, em vez de a empurrar para baixo". Podes utilizar o JSFiddle para apresentares um caso simples do problema que estás a ter. Isso facilita bastante o processo para quem está a tentar ajudar.

[qim]

Olá

Já esqueci o script. Good bye script.

a única coisa que quero agora, é voltar à estaca 0 e tentar que o conteúdo #content #box4 empurre a #footer à maneira que o ecrã se vai estreitando e o conteúdo vai ficando mais longo. Entre @800 e @550.

Vê como está agora se fechares a largura do ecrã.

PS-

A falar de magia.... de repente a #footer está a funcionar mais ou menos, com o fim do conteúdo sempre visível.

Se conseguir por esta página funcionar vai servir de base para a modificação de algumas mais. Não sei o que fiz, se foi por sorte ou azar. Será que as mudanças de position;absolute/relateve estão bem. ou é mera sorte?

podes dar um avista de lhos, por favor?

CORRECÇÃO

No final de contas noutro browser à volta dos @600px a parte final do conteúdo mergulha por debaixo da #footer

Edited March 17, 2015 at 07:47 PM by qim

[qim]

Com os meus pedidos de desculpa vou fechar esta discussão e começar outra. pois afinal não é a parte central mas sim a coluna da esquerda que decide a altura do #footer. O que necessito é um script que permita à coluna da esquerda acompanhar a parte central quando esta começa a alongar-se verticalmente como acontece em ecrãs mais pequenos.

Edited March 18, 2015 at 06:10 AM by qim