Iframe Autoajustable (se ajusta automaticamente al tamaño)

Sección para"expertos", que quieren cambiar el código HTML de su página o insertar Java Scripts, Iframes, etc.. Si eres principiante, esta sección no te hace falta.

ModeradorCOLON Moderadores

Klk3
ExAdministrador
ExAdministrador
MensajesCOLON 2803
RegistradoCOLON 18 Nov 2005 16:09
UbicaciónCOLON Barcelona,España
CONTACTCOLON

Iframe Autoajustable (se ajusta automaticamente al tamaño)

Notapor Klk3 » 26 Dic 2009 12:03

Buenas chicos llevo ya 3 días para conseguir que este código funcione y buscando mucho lo encontré!
Lo que hace es que tu tienes un iframe y al hacer que alguna web se abra dentro de este, se ajusta automaticamente al tamaño de la web.

Entre <head> y </head> pon esto:

CódigoColon Seleccionar todo

<script>
function ajustar() {
document.getElementById("prueba").style.height = window.frames.prueba.document.body.style.
height;
}
function ini() {
document.getElementById("prueba").height = document.frames.prueba.document.body.offsetHeight + document.frames.prueba.document.body.scrollHeight;
}

function getWindowData(n,i){
    var ifr=document.getElementById(i).contentWindow.document || document.getElementById(i).contentDocument;
    var widthViewport,heightViewport,xScroll,yScroll,widthTotal,heightTotal;
    if (typeof window.frames[n].innerWidth != 'undefined'){
        widthViewport= window.frames[n].innerWidth;
        heightViewport= window.frames[n].innerHeight;
    }else if(typeof ifr.documentElement != 'undefined' && typeof ifr.documentElement.clientWidth !='undefined' && ifr.documentElement.clientWidth != 0){
        widthViewport=ifr.documentElement.clientWidth;
        heightViewport=ifr.documentElement.clientHeight;
    }else{
        widthViewport= ifr.getElementsByTagName('body')[0].clientWidth;
        heightViewport=ifr.getElementsByTagName('body')[0].clientHeight;
    }
    xScroll=window.frames[n].pageXOffset || (ifr.documentElement.scrollLeft+ifr.body.scrollLeft);
    yScroll=window.frames[n].pageYOffset || (ifr.documentElement.scrollTop+ifr.body.scrollTop);
    widthTotal=Math.max(ifr.documentElement.scrollWidth,ifr.body.scrollWidth,widthViewport);
    heightTotal=Math.max(ifr.documentElement.scrollHeight,ifr.body.scrollHeight,heightViewport);
    return [widthViewport,heightViewport,xScroll,yScroll,widthTotal,heightTotal];
}
function resizeIframe(ID,NOMBRE){
document.getElementById(ID).height=null;
document.getElementById(ID).width=null;
window.location='#';//necesario para safari
var m=getWindowData(NOMBRE,ID);
document.getElementById(ID).height=m[5];
document.getElementById(ID).width=m[4]+22;
}
function addEvent(obj, evType, fn, useCapture){
 
 if (obj.addEventListener){
    obj.addEventListener(evType, fn, useCapture);
   
  } else if (obj.attachEvent){
    obj.attachEvent("on"+evType, fn);
   
  } else {
   obj['on'+evType]=fn;
  }
}
window.onload=function(){
    resizeIframe('pp','pp');
    addEvent(document.getElementById('pp'), 'load', function(){resizeIframe('pp','pp');}, false);
}
</script>


y el iframe será así

CódigoColon Seleccionar todo

<iframe id="NOMRE DEL IFRAME" name="NOMBRE DEL IFRAME" src="body11.html" with="480" onload="ini()" width="1124" height="150" border="0" frameborder="0" target="Iframe"></iframe>



Recuerda que para que esto funcione, la web que has abrir en el iframe ha de ser del mismo servidor donde esté este, por ejemplo si lo pones en una web de palimpalem el link al iframe será body11.html solo eso,

saludos

PD: es un código extraído de internet el cual he modificado un poco para que vaya en todos lo navegadores
Imagen
Hasta siempre ha sido un placer muy grande :D

Avatar de Usuario
Ivan
Master User
Master User
MensajesCOLON 2172
RegistradoCOLON 29 Oct 2005 00:15
UbicaciónCOLON Santa Fe, Argentina
CONTACTCOLON

Re: Iframe Autoajustable (se ajusta automaticamente al tamaño)

Notapor Ivan » 26 Dic 2009 18:13

ya lo he añadido a favoritos ;)

Klk3
ExAdministrador
ExAdministrador
MensajesCOLON 2803
RegistradoCOLON 18 Nov 2005 16:09
UbicaciónCOLON Barcelona,España
CONTACTCOLON

Re: Iframe Autoajustable (se ajusta automaticamente al tamaño)

Notapor Klk3 » 26 Dic 2009 18:30

funciona perfectamente, pero en IE hay gente que no le acaba de funcionar, veré de arreglarlo
Imagen
Hasta siempre ha sido un placer muy grande :D

Avatar de Usuario
carlitos
ExModerador
ExModerador
MensajesCOLON 1635
RegistradoCOLON 29 Nov 2006 17:02
UbicaciónCOLON Gavà M'encanta Gavà!
CONTACTCOLON

Re: Iframe Autoajustable (se ajusta automaticamente al tamaño)

Notapor carlitos » 27 Dic 2009 23:09

yo lo tube que usar hace 6 meses para a web de una empresa... hasta que lo encontré.. uf !!

El mio funciona con todos los navegadores, creo! Pero nose.. xdd
Imagen
De lo que no se puede hablar.. mejor es callarse

Klk3
ExAdministrador
ExAdministrador
MensajesCOLON 2803
RegistradoCOLON 18 Nov 2005 16:09
UbicaciónCOLON Barcelona,España
CONTACTCOLON

Re: Iframe Autoajustable (se ajusta automaticamente al tamaño)

Notapor Klk3 » 28 Dic 2009 00:13

postealo siempre va bien tener de mas
Imagen
Hasta siempre ha sido un placer muy grande :D


Volver a

¿Quién está conectado?

Usuarios navegando por este Foro: 5 y 0 invitados