Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/06/2012, 19:12
deywibkiss
 
Fecha de Ingreso: mayo-2011
Mensajes: 105
Antigüedad: 13 años
Puntos: 3
Pregunta Nivelar altura de capas div dinamicamente

Hola amigos!! necesito nivelar la altura de dos capas dinamicamente, es decir que cuando una crezca en contenido la otra nivele su altura.

He hecho esta prueba:

Codigo CSS:

Código CSS:
Ver original
  1. // caja contenedora principal
  2. #contentprofile{
  3.     float:left;
  4.     margin-left:220px;
  5.     width: 900px;
  6.     height:auto;
  7.     background-color:#FFF;
  8.     clear:both;
  9. }
  10.  
  11. //caja de opciones que flota a la izquierda
  12. #setaccountoptions{
  13.     border-right: 1px #D8D8D8 solid;
  14.     text-align:left;
  15.     padding-top: 28px;
  16.     padding-left: 15px;
  17.     float:left;
  18.     width:205px;   
  19.     min-height:500px;
  20. }
  21.  
  22. //caja que muestra dinamicamente por php el contenido de la opcion escogida
  23. //(para aquellos que no entiendan: en esta capa se llama otra pagina dependiendo del id de la opcion escogida)
  24.  
  25. #optionselected{
  26.    
  27.     margin-left:235px;
  28.     text-align:left;
  29.     width:630px;
  30.     height:auto;
  31.     padding:5px;
  32.     float:right;
  33. }


Codigo HTML:

A grandes rasgos es algo como:

Código HTML:
Ver original
  1. <div id="contentprofile">
  2. <div id="setaccountoptions"><!---el contenido aqui es corto-></div>
  3. <div id="optionselected"><!--el contenido aqui es mas largo--></div>
  4. </div>

El codigo JavaScript propuesto es este:

Código Javascript:
Ver original
  1. function dinamicheight(div1,div2){
  2.     var height1 = document.getElementById(div1).height;
  3.     var height2 = document.getElementById(div2).height;
  4.     if (height2 > height1)
  5.     {
  6.         document.getElementById(div1).height = height2;
  7.     }
  8.    
  9. }

luego:

Código Javascript:
Ver original
  1. window.onload = function() {
  2. var div1 = "setaccountoptions", div2 ="optionselected";
  3. document.getElementById("optionselected").onclick = dinamicheight(div1,div2);
  4. }

Lo que sucede es que el div derecho crece dinamicamente haciendo clic en botones enlaces etc de la pagina cargada dinamicamente con php. Creeria que si hacemos clic en esos elementos el alto cambia y la funcion corre...

pero no he encontrado otra solucion, para detectar cuando crece o cuando disminuye el div derecho.

Agradeceria su ayuda....