Tengo una pagina con un iframe donde este interiormente tiene un formulario con varios elementos. Para ajustar el iframe y elementos interiores según el tamaño que tenga el navegador en ese momento tengo hecha una pequeña función en JavaScript.
Es decir al inicio de la pagina el tamaño que tiene inicialmente el navegador me salen todos los elementos del iframe ( caja de texto y botones ) ajustados al tamaño de la ventana padre. Pero cuando cambio el tamaño del navegador por un tamaño mas estrecho y mas largo hay elementos que no llegan a salir por falta de espacio vertical ( por ejemplo botones cerca del pie de la pagina )
Si vuelvo a llamar a la misma url que contiene la pagina para que me cargue de nuevo con el tamaño mas estrecho y largo que he cambiado del navegador entonces los elementos se recolocan perfectamente y los botones que antes no salian vuelven a aparecer.
El código que tengo puesto es el siguiente: En el body del HTML:
<iframe src="ruta/pantalla1.aspx" width="100%" height="100%" scrolling="no" id="myIframe" style="overflow: hidden; " onload="resizeIframe(this)" ></iframe>
En el script del head:
function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.body.scrollHeight + 10 + 'px';
}
¿ Hay alguna forma de hacer por css o JavaScript que el iframe se ajuste dinámicamente a los cambios de tamaño del navegador ?