cómo escalar divs cuando minimizo el navegador para que no se colapsen entre sí

Tengo una pequeña pregunta. ¿Cómo es posible establecer las alturas de 2 divs para que no se colapsen sino que se amplíen dinámicamente si minimizo la ventana? Hice esto en js:

$(document).ready(function(){ var footer = document.getElementById('footer').offsetHeight; var sidebar = document.getElementById('sidebar').offsetHeight; document.getElementById('sidebar').style.height = sidebar - footer + 'px'; }); 

esto funciona pero no cuando minimizo, ¿tengo que hacerlo en una función y llamarlo durante window.load o algo así? El problema ahora es que cuando minimizo el navegador, los divs se repiten de nuevo.

Gracias

Creo que necesitas unirte al evento resize

 $(document).ready(function(){ var sidebar = document.getElementById('sidebar').offsetHeight; $(window).resize(function(){ var footer = document.getElementById('footer').offsetHeight; document.getElementById('sidebar').style.height = sidebar - footer + 'px'; }); }); 

Esta es la solución también para aquellos que alguna vez buscan este tipo de configuración …

  

este código establece la altura de la barra lateral dinámicamente, tanto durante document.ready como durante el cambio de tamaño. gracias especiales a Bart por su ayuda!