[sss2019]

Здравствуйте. Помогите разобраться с onload.

У меня есть два блока на сайте sidebar и main_container.
Sidebar шириной 200 пикселей, задается в css.

А main_container ширина не указана, но при загрузке страницы, его ширина задается скриптом. и рассчитывается так body.clientWidth - 200.

Допустим экран шириной 1000 пикселей, значит main_container будет 800 п.

Далее, браузер автоматически рассчитывает высоту исходя из количества контента в них.

Допустим в main_container много текста, и при ширине 800п он получает высоту 1200п.

Следующий шаг, скрипт задает высоту для sidebar такую же как и для контейнера, если контейнер получился 1200 п, то и sidebar будет 1200 п.



Но проблема в следущем, когда страница загружается, и срабатывает onload, который задает все величины, то он почему то видит что ширина контейнера не 800п а все 1000, и высота соответственно не 1200, а 900п.

Но самое главное, что далее то видно что контейнер подгрузился нормально, принял высоту ширину 800п и высоту 1200п., а sidebar так и остался 900п.

ХОТЯ, в коде явно указано, что сначала он изменяет ширину контейнера, и получает его высоту, а затем уже эту высоту применяет к sidebar. Вот код скрипта

var bodyH = document.body.clientHeight;
	var bodyW = document.body.clientWidth;
	var containerH = document.getElementById('main_container').clientHeight;
	var sidebarH = document.getElementById('sidebar').clientHeight;
	
	bodyW = bodyW - 225 - 50;
	document.getElementById('main_container').style.width = bodyW + 'px';
	
	bodyH = bodyH - 30;
	if(containerH < bodyH) { containerH = bodyH; document.getElementById('main_container').style.height = bodyH + 'px'; }
	bodyH = bodyH + 30;
	sidebarH = containerH;
	alert(containerH);
	if(bodyH > sidebarH) sidebarH = bodyH;
	document.getElementById('sidebar').style.height = sidebarH + 'px';