Динамическое изменение высоты боксов.
 

Прошу не пинать ногами,учусь :)
Нужна реализация одной вещи:
Нужно на 4 дива последовательно повесить высоту видимой области браузера. Дивы идут сразу после body.
Есть такой код:

function boxheight(){
	var _massdiv = document.getElementsByTagName('div');
	for(var i = 0;i < _massdiv.length;i++){
		if(_massdiv[i].className == "wrap-page"){
			_massdiv[i].style.height = _massdiv[i].parentNode.offsetHeight + 'px';
		}
		if(_massdiv[i].className == "w-r"){
			_massdiv[i].style.height = _massdiv[i].parentNode.offsetHeight + 'px';
		}
		if(_massdiv[i].className == "w-t"){
			_massdiv[i].style.height = _massdiv[i].parentNode.offsetHeight + 'px';
		}
		if(_massdiv[i].className == "w-b"){
			_massdiv[i].style.height = _massdiv[i].parentNode.offsetHeight + 'px';
		}
	}
}
function initPage(){
	boxheight();
	setInterval("boxheight()", 1);
}
if (window.addEventListener) window.addEventListener("load", initPage, false);
else if (window.attachEvent && !window.opera) window.attachEvent("onload", initPage);

Все вроде бы хорошо,я делаю ресайз окна ctrl + скролл - высота меняеться.При обратном скролле(тоесть увеличении или же возврате по дефолту) высота остаеться как и была,тоесть не высчитываеться новая высота окна,а остаеться та,до которой я уменьшил окно. Можно ли это как-то побороть или же я в корне не правильно придумал или же чего-то покаместь не понимаю? На Сss решение не нужно,нужен именно JS.
Возможно кто-то сталкивался или знает какое-то решение.
Буду очень признателен за помощь.
Спасибо.