html - ejemplos - <iframe>-¿Cómo mostrar la altura completa de la página referenciada?
iframe que es (3)
Puede usar un lenguaje de scripting para incluir la página en la página principal; de lo contrario, puede probar uno de estos métodos de JavaScript:
http://brondsema.net/blog/index.php/2007/06/06/100_height_iframe http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/Q_22840093.html
Tengo una aplicación que me gustaría incorporar dentro de nuestras compañías CMS. La única manera de hacerlo (me dicen) es cargarlo en un <iframe> .
Fácil: ¡simplemente configure la height y el width al 100% ! Excepto, no funciona.
Descubrí cómo configurar frameborder en 0 , por lo que al menos parece parte del sitio, pero prefiero no tener una barra de desplazamiento fea dentro de una página que ya tiene una.
¿Conoces algún truco para hacer esto?
EDITAR: Creo que necesito aclarar algo mi pregunta:
- la compañía CMS muestra la pelusa y cosas para todo nuestro sitio web
- la mayoría de las páginas creadas a través del CMS
- mi aplicación no lo es, pero me permitirán incrustarlo en un
<iframe> - No tengo control sobre el
iframe, por lo que cualquier solución debe funcionar desde la página referenciada (de acuerdo con el atributosrcde la etiquetaiframe) - el CMS muestra un pie de página, por lo que establecer la altura en 1 millón de píxeles no es una buena idea
¿Puedo acceder a las páginas padre DOM desde la página referenciada? Esto podría ayudar, pero puedo ver que algunas personas podrían no querer que esto sea posible ...
Esta técnica parece funcionar ( obtenida de varias fuentes, pero inspirada por el enlace de la respuesta aceptada:
En el documento principal:
<iframe id="MyIFRAME" name="MyIFRAME"
src="http://localhost/child.html"
scrolling="auto" width="100%" frameborder="0">
no iframes supported...
</iframe>
En niño:
<!-- ... -->
<body>
<script type="text/javascript">
function resizeIframe() {
var docHeight;
if (typeof document.height != ''undefined'') {
docHeight = document.height;
}
else if (document.compatMode && document.compatMode != ''BackCompat'') {
docHeight = document.documentElement.scrollHeight;
}
else if (document.body
&& typeof document.body.scrollHeight != ''undefined'') {
docHeight = document.body.scrollHeight;
}
// magic number: suppress generation of scrollbars...
docHeight += 20;
parent.document.getElementById(''MyIFRAME'').style.height = docHeight + "px";
}
parent.document.getElementById(''MyIFRAME'').onload = resizeIframe;
parent.window.onresize = resizeIframe;
</script>
</body>
Por cierto: esto solo funcionará si el padre y el hijo están en el mismo dominio debido a una restricción en JavaScript por razones de seguridad ...
Siempre que su iframe esté alojado en el mismo servidor que la página que lo contiene, puede acceder a él a través de javascript .
Hay una serie de métodos sugeridos para configurar el iframe a la altura máxima de los contenidos , cada uno con diversos grados de éxito: un google para este problema muestra que es bastante común, sin ajustes reales de talla única. solución de consenso, me temo!
Varias personas han informado que este script funciona, pero puede necesitar algunas modificaciones para su caso específico (una vez más, suponiendo que su iframe y página principal están en el mismo dominio).
Puede que me esté perdiendo algo aquí, pero agregar scrolling=no como un atributo a la etiqueta iframe normalmente elimina las barras de desplazamiento.