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// caja contenedora principal
#contentprofile{
float:left;
margin-left:220px;
width: 900px;
height:auto;
background-color:#FFF;
clear:both;
}
//caja de opciones que flota a la izquierda
#setaccountoptions{
border-right: 1px #D8D8D8 solid;
text-align:left;
padding-top: 28px;
padding-left: 15px;
float:left;
width:205px;
min-height:500px;
}
//caja que muestra dinamicamente por php el contenido de la opcion escogida
//(para aquellos que no entiendan: en esta capa se llama otra pagina dependiendo del id de la opcion escogida)
#optionselected{
margin-left:235px;
text-align:left;
width:630px;
height:auto;
padding:5px;
float:right;
}
Codigo HTML:
A grandes rasgos es algo como:
Código HTML:
Ver original<div id="contentprofile"> <div id="setaccountoptions"><!---el contenido aqui es corto-></div> <div id="optionselected"><!--el contenido aqui es mas largo--></div>
El codigo JavaScript propuesto es este:
Código Javascript
:
Ver originalfunction dinamicheight(div1,div2){
var height1 = document.getElementById(div1).height;
var height2 = document.getElementById(div2).height;
if (height2 > height1)
{
document.getElementById(div1).height = height2;
}
}
luego:
Código Javascript
:
Ver originalwindow.onload = function() {
var div1 = "setaccountoptions", div2 ="optionselected";
document.getElementById("optionselected").onclick = dinamicheight(div1,div2);
}
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....