Entradas con la etiqueta iframe

Iframe completo con CSS

Primero, definimos el iframe:


<iframe id="the_iframe" src="https://www.grafeco.com" width="300" height="auto" frameborder="0" scrolling="yes"></iframe>

y ahora, el css:


body{margin:0;}

#the_iframe{
   width:100%;
   height:100%;
   border: 0;
   position:fixed;
   top:0;
   left:0;
   right:0;
   bottom:0;
}



Ya está, tan sencillo y tan útil.

Ver más

Iframe con JavaScript y Height Automático

Bueno, aquí una explicación de cómo incluir un ifame con ayuda de JavaScript y controlar el alto automático.

Primero, el código en JavaScript en el <head>:

<script language="JavaScript">
<!--
function calcHeight()
{
 //Cojo la altura en nuestra página
 var the_height=
 document.getElementById
("the_iframe").contentWindow.
 document.body.scrollHeight;
//Cambio la altura del iframe
 document.getElementById("the_iframe")
.height= the_height;
}
//-->
</script>

 

Y ahora entre <body> y </body> :

<span style="color: #993366;"><iframe width="100%" id="the_iframe" onLoad="calcHeight();" src="ladireccionquequiera" scrolling="NO" frameborder="0" height="1"></iframe></span>

Aviso: puede haber incompatibilidades si el las páginas no están en el mismo servidor.

Ver más