Redimensionado de iframe al tamaño de la página contenida

Publicado en Programación el 8 de June de 2009 por Manel Pérez Mata
Tags: HTML, JavaScript

Con este sencillo código JavaScript, ajustamos la altura del iframe al tamaño de la página en él conteido, de ese modo, evitaremos el molesto scroll lateral.

<html>
    <body>
        <script language="JavaScript">
            //Ajusta el tamaño de un iframe al de su contenido interior para evitar scroll
            function autofitIframe(id){
                if (!window.opera && document.all && document.getElementById){
                    id.style.height=id.contentWindow.document.body.scrollHeight;
                } else if(document.getElementById) {
                    id.style.height=id.contentDocument.body.scrollHeight+"px";
                }
            }
        </script>
        <iframe id="miFrame" src="http://www.tecnoretales.com/" width="100%" height="0" frameborder="1" transparency="transparency" onload="autofitIframe(this);"></iframe>
    </body>
</html>

Una vez cargado el iframe, llamamos a la función autofitIframe que se encargará de obtener la altura total de la página contenida y se la asignará al tamaño del iframe.
Simplemente…

Compártelo!! These icons link to social bookmarking sites where readers can share and discover new web pages.

(No Ratings Yet)

Loading ...

6 Comments on “ Redimensionado de iframe al tamaño de la página contenida ”

Ignacio Alcázar
April 18th, 2010 23:46
Tenía un código parecido por algún lado pero no lo encontraba. Muchas gracias.
Avolaje
April 30th, 2010 0:13
Gracias por el script para redimensionar automáticamente un iframe. He probado algunos script que aparecen en internet y este me parece el mejor.

Adán Valenzuela Olaje
javirol
September 6th, 2010 0:15
Hola, es un código interesante y parece que funciona, aunque estoy embebiendo un foro en Wordpress y con este y otros códigos redimensiona bien, pero supongamos que lo hace a 1000 px, cuando vuelvo al index del foro que tiene por ejemplo 200px se queda de nuevo en 1000px presentando el resto en blanco.

Sabes a que se puede deber esto? el tipo de foro es phpbb y lo he probado simplemente con iframe, sin contenedores. Me ayudaría bastante saber porque puede pasar esto.
Ronald
November 13th, 2010 16:44
Buen codigo…he probado otros y son muy confusos y no funcionan tanto en IE como en Mozilla
mariana
June 20th, 2011 23:28
gracias eres un genio, me sirvio de mucho el aporte
stroldj
September 15th, 2011 11:38
Buenas:

A ver si alguién lo lee i me da una respuesta….

He usado el codigo, antes de nada GRACIAS, funciona bastante bien.. porque digo bastante? pues porque me ha surgido un problemilla:

Estoy intentando poner el iframeen cuestión dentro de una tabla, o en una pagina contenida por otra con otro iframe, (todo cuestion de centrado de la pagina). Entonces “peta”, aperece el contenido una fracción de segundo y desaparece todo el contenido. (si quito la funcion se ve)

a ver si alguien se le ocurre algo

Gracias