Foros del Web » Creando para Internet » HTML »

iframe ajustable

Estas en el tema de iframe ajustable en el foro de HTML en Foros del Web. Se que este tema a sido tratado en innumerables foros y he encontrados algunos aquí, pero la verdad es que aún sigo con el mismo ...
  #1 (permalink)  
Antiguo 10/12/2008, 07:03
Avatar de CREW  
Fecha de Ingreso: diciembre-2004
Ubicación: Mi Casa
Mensajes: 793
Antigüedad: 13 años
Puntos: 0
iframe ajustable

Se que este tema a sido tratado en innumerables foros y he encontrados algunos aquí, pero la verdad es que aún sigo con el mismo problemas y es que trato de ajustar un "iframe" a los tamaños (alturas) de las pag. que carga externamente...

Les explico tengo un HTML en el cual hay un "iframe" en el cual me cargan las diferentes páginas (generalmente php) a través de unos botones, he probado diferentes códigos pero solo 2 an estado cerca pero aun no ocurre lo que quiero...

Código Nº 1:

Pagina Padre

Código HTML:
<script type="text/javascript">
function ini() {
 document.getElementById("contenido").height = window.frames.contenido.document.body.offsetHeight + window.frames.contenido.document.body.scrollHeight;
}
</script> 
Iframe

Código HTML:
<iframe name='contenido' width='764'  marginwidth='0' marginheight='0' frameborder='0'  id="contenido" scrolling="No" onload="ini()"></iframe> 
Con este código, todos las "PAGINAS HIJOS" (independiente de la altura) me cargan, pero el problema ocurre que el "ALTO" es mucho más grande que el contenido de la "PAGINAS HIJOS"...

Con el 2º código que utilizó es este, y lo encontre aquí:

Código Nº 2:

Página Padre

Código HTML:
<script type="text/javascript">
// <![CDATA[

function recalcula(){
	var daH = (document.body && document.body.clientHeight)?parent.interior.document.body.clientHeight: 0; 
	daH = (document.addBinding)?daH+20:daH+5;
	//alert(daH);
	document.getElementById("elIframe").style.height = daH + "px";
}

function cargar(url){
	parent.interior.location.href=url;
}
	
// ]]>

</script>


<style type="text/css">
<!--
iframe {
width : 764px;
overflow : hidden;
}
-->
</style> 
Iframe

Código HTML:
<iframe name='interior' marginwidth='0' marginheight='0' frameborder='0' id="elIframe" scrolling="NO" onload="recalcula()"></iframe> 
Código Páginas hijos:

solo pongo este estilo:

Código HTML:
<style type="text/css">
<!--
html, body {
padding : 0;
margin : 0;
width : 764px;
}
-->
</style> 
Que es lo que me ocurre con este código, es que me carga todos las "PAGINAS HIJOS" pero no se me adapta, o sea, el iframe queda con el mismo tamaño...

Alguna ayuda u orientación, plisssss!!!!

Gracias!!!!
__________________
_________________________________
Mario Contreras || Diseñador Gráfico + Web:Mi Blog
  #2 (permalink)  
Antiguo 15/12/2008, 08:22
Avatar de sanchy  
Fecha de Ingreso: octubre-2008
Mensajes: 389
Antigüedad: 9 años, 1 mes
Puntos: 9
Respuesta: iframe ajustable

Hola, yo estoy media en la misma, buscando por todos lados. Y no se por que scripts que la gente dice que le funcionan, a mi no me funcionan.

Este fue el unico que me funciono:
pero por alguna razon no me funciona con paginas .PHP tengo un blog de wordpress en "mi" dominio y eso es lo que carga dentro del iframe. Si pongo cualquier otra pagina de mi dominio en el iframe, la carga y cambia la altura perfectamente. Pero con el blog el iframe no cambia :/

Código:
var iframeids=["blog"]

//Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended):
var iframehide="yes"

var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers

function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}

function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}

function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}

function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}

if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller
  #3 (permalink)  
Antiguo 15/12/2008, 08:39
Avatar de sanchy  
Fecha de Ingreso: octubre-2008
Mensajes: 389
Antigüedad: 9 años, 1 mes
Puntos: 9
Respuesta: iframe ajustable

bueno al final esto me soluciono todo:
http://www.forosdelweb.com/f13/redim...irefox-596720/

el unico pequeño problema que tengo es que al navegar por el contenido de iframe, si la pagina que carga es mas chica que la anterior, no se re dimensiona (pasa solo en chrome, en FF lo hace bien)
  #4 (permalink)  
Antiguo 15/12/2008, 09:55
Avatar de sanchy  
Fecha de Ingreso: octubre-2008
Mensajes: 389
Antigüedad: 9 años, 1 mes
Puntos: 9
Respuesta: iframe ajustable

-.- retiro lo dicho, de repente no me fuinciono mas en Firefox. si alguien se anima a ver el lenguaje del script de mi pagina a ver si hay algo q esta mal www.glitzypopculture.com
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:24.