Одинаковая высота колонок

Зачем javascript? http://jsfiddle.net/tUQU7/1/

Спасибо Оптимизайка, но сли я спрашиваю значит надо именно то что я спрашиваю =)

На самом деле дела обстоят немного сложнее, у меня две колонки фиксированной ширины и 3 самоизменяемые, поэтому проценты тут не катят. Мало того две колонки заполняются изображением CSS с repeat-y и у нее тоже высота изменяемая.

завяжите функцию на изменение размера окна

$(document).ready(function() { 

    $(window).resize(function () { 

      alert('Изменение размера'); 

    }); 

});

А как её можно связать с функцией приведенной выше?

как связать, честно говоря не в курсе, но можно так попробовать:

$(document).ready(function() {
    function setEqualHeight(columns) {
        var tallestcolumn = 0;
        columns.each( function() {
            currentHeight = $(this).height();
            if(currentHeight > tallestcolumn) {
                tallestcolumn  = currentHeight;
            }
        });
        columns.height(tallestcolumn);
    }
    setEqualHeight($(".EqualHeights"));  

});

$(document).ready(function() { 
   $(window).resize(function () { 
     function setEqualHeight(columns) {
        var tallestcolumn = 0;
        columns.each( function() {
            currentHeight = $(this).height();
            if(currentHeight > tallestcolumn) {
                tallestcolumn  = currentHeight;
            }
        });
        columns.height(tallestcolumn);
    }
    setEqualHeight($(".EqualHeights"));  
 
    }); 
});

одна срабатывает при загрузке документа, вторая при изменении размера.

Если Ваша функция работает, то должно получиться.

Можно упростить намного, но я не силен в javascript. Обязательно где-нить накосячу.

К сожалению ничего не происходит абсолютно. Невидно никакой разницы.

На самом деле видно через firebag что функция как бы исполняется при изменении размера окна, но высота колонок остаётся той же что зафиксировалась при первой перезагрузке страницы.

function setEqualHeight(columns) {
	var tallestcolumn = 0;
	columns.each( function() {
		currentHeight = $(this).height();
		if(currentHeight > tallestcolumn) {
			tallestcolumn  = currentHeight;
		}
	});
	columns.height(tallestcolumn);
}

$(document).ready(function() {

	setEqualHeight($(".EqualHeights"));  

	$(window).resize(function () { 
		setEqualHeight($(".EqualHeights"));  
	}); 	
});

А, ну да. Все правильно. Не поменяется высота, т.к. при загрузке документа columns.height принимает определенное значение и при изменении размера окна currentHeight всегда равно tallestcolumn.

Для корректной работы скрипта нужно чтобы при изменении размера окна хотя бы один элемент column менял свой размер, тогда другие элементы будут под него подстраиваться. А так получается, что в самом начале Вы своей функцией задаете фиксированную высоту всех колонок.

Это если я правильно понял фразу "ничего не происходит абсолютно".

А если функцию отключить, при ресайзе браузера хоть одна колонка меняет высоту как нужно? Если да, то попробовать задержку ввести перед вызовом функции, чтобы браузер успел изменить высоту колонки, как это делается при ресайзе. Если нет - исправлять верстку.

Что бы было более понятно сделал скрины.