JQUERY - AJUSTANDO AS ALTURAS DIV NO REDIMENSIONAMENTO DA JANELA

Estou trabalhando em um recode para um site de agência do governo no momento, seu site existente usa essencialmente tabelas (SHAME!) Para lidar com o layout. 

Um dos benefícios de trabalhar com tabelas é, naturalmente, a facilidade com que os layouts de várias colunas podem ser alcançados e não há necessidade de enganar com a qual recorremos com layouts CSS. 

Então, em meus esforços para recodificar seu site para o layout do CSS, tive que encontrar algumas soluções alternativas. 

Normalmente eu teria usado colunas falsas desenvolvidas há anos, que geralmente funcionam muito bem, mas desta vez eu decidi que queria empregar jQuery para ajudar.

Eu escolhi usar o jQuery para me ajudar com muitas coisas, mas, o mais importante, definir as alturas de duas divisórias que flutuam uma ao lado da outra, com a primeira também contendo duas divisões flutuadas dentro das quais, quando o layout fica muito estreito, a segunda cai abaixo o primeiro.

Como o site de roupas importadas deles possui as colunas de notícias com uma cor b / g e os recursos com uma segunda cor b / g na primeira tentativa usando o plugin jQuery equalHeights. Isso funcionou bem, mas adicionou barras de rolagem irritantes. Então eu usei seu código como base para apenas fazê-lo manualmente.

function adjustHeights () {
hNews = $ ('# news'). height (); // Obter altura
hFeatures = $ ('# features'). Height (); // Obter altura
mHeight = hNews> hFeatures? hNews: hForestry; // Defina mHeight para a maior das duas alturas 

$ ('# news, #features'). Height (mHeight); // Defina ambos para alturas iguais
}

Isso funcionou bem. O problema que eu agora enfrentava, e provavelmente, é que, se alguém redimensionasse seu navegador, as colunas não se ajustavam. Então, para capturar o evento de redimensionamento e os tamanhos de reajuste, usei o seguinte código:

$ (janela) .resize (function () {
$ ('# news, #features'). css ("height", "auto"); // Elimina o valor de alturas
adjustHeights (); // Ajusta as alturas mais uma vez
});

Até agora testei isso no IE6, FF3.06 e Safari 3.21 e está funcionando em cada um. 

Safari parece fazer um trabalho melhor também, enquanto eu estou arrastando a largura dos navegadores, ele está aplicando as correções.

Espero que isso ajude alguém a tentar o mesmo!