Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

AlexCT

Iframe auto-ajustaveis

Recommended Posts

Achei na página do suporte da MS esse codigo. Entretanto, só funciona no IE. Se alguem tem alguma ideia tambem agradeço.

 

function reSize()

{

try

{

var oBody = ifrm.document.body;

var oFrame = document.all("ifrm");

 

oFrame.style.height = oBody.scrollHeight + (oBody.offsetHeight - oBody.clientHeight);

oFrame.style.width = oBody.scrollWidth + (oBody.offsetWidth - oBody.clientWidth);

}

catch(e)

{

window.status = 'Error: ' + e.number + '; ' + e.description;

}

}

 

/**********************************************************************/

 

<iframe

src =""

width="100%"

height="100%"

frameborder="0"

style="padding: 0; margin: 0;"

scrolling="no"

marginheight= "0"

marginwidth ="10"

onload="reSize()"

id="ifrm">

</iframe>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pesquisei um pouco mais e achei um codigo pro FF.

 

function reSize()

{

try

{

if(document.all)/* Verifica se é o IE */

{

var oBody = ifrm.document.body;

var oFrame = document.all("ifrm");

 

oFrame.style.height = oBody.scrollHeight + (oBody.offsetHeight - oBody.clientHeight);

oFrame.style.width = oBody.scrollWidth + (oBody.offsetWidth - oBody.clientWidth);

}

else /* Para FF e Opera */

{

var tamanho = parent.document.getElementById('ifrm').contentDocument.body.scrollHeight;

parent.document.getElementById('ifrm').style.height = (tamanho+10)+'px';

}

}

catch(e)

{

alert('Error: ' + e.number + '; ' + e.description);

}

}

 

/*******************************************************/

 

o codigo do IFRAME fica igual

 

<iframe

src ="html/index.html"

width="100%"

height="100%"

frameborder="0"

style="padding: 0; margin: 0;"

scrolling="no"

marginheight= "0"

marginwidth ="10"

onload="reSize()"

id="ifrm">

</iframe>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá a todos.

Vi o post de vocês acerca de iframes auto-ajustáveis.

Seguinte: Trabalho usando muito o iframe e tenho um script que é bem legal. A página que contén o código do iframe se auto-ajustará de acordo com a página carregada. Por exemplo: imagine que você pôs na altura do iframe 300px e esse local será responsável pelo carregamento de outras páginas. Então se uma página tiver mais de 300px, ou dá rolagem ou ela é cortada pela metade e isso não é legal.

Pois bem, procedam da seguinte forma:

 

Na página que contém o script do iframe, use esse código javascript. Não esqueçam que o código javascript vai entre as tags <head>código javascript </head>

 

<script language="javascript" type="text/javascript">
function mudarTamanho(Tam){document.getElementById("Conteudo").height = Tam;}

</script>

no trecho

getElementById("Conteudo"), note que o que está dentro dos parênteses é o id de seu iframe, conforme código abaixo.


//aqui o script do iframe

<iframe name="alvo"  [b]id="Conteudo"[/b] scrolling="no" src="suapagina.html" frameborder="0" height="altura" width="largura"  marginheight="0" marginwidth="0"> </iframe>

Na página que será carregada dentro do iframe, use esse código:

 

<script language="JavaScript" type="text/javascript">
function EnviarTam(){
window.parent.mudarTamanho(document.body.offsetHeight);
}

e dentro da tag <body> proceda assim:

 

<body  onload="EnviarTam()">

Prontinho. O conteúdo se auto-ajustará no seu iframe.

 

É isso, espero que tenha ajudado.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá a todos.

Vi o post de vocês acerca de iframes auto-ajustáveis.

Seguinte: Trabalho usando muito o iframe e tenho um script que é bem legal. A página que contén o código do iframe se auto-ajustará de acordo com a página carregada. Por exemplo: imagine que você pôs na altura do iframe 300px e esse local será responsável pelo carregamento de outras páginas. Então se uma página tiver mais de 300px, ou dá rolagem ou ela é cortada pela metade e isso não é legal.

Pois bem, procedam da seguinte forma:

 

Na página que contém o script do iframe, use esse código javascript. Não esqueçam que o código javascript vai entre as tags <head>código javascript </head>

 

<script language="javascript" type="text/javascript">
function mudarTamanho(Tam){document.getElementById("Conteudo").height = Tam;}

</script>

no trecho

getElementById("Conteudo"), note que o que está dentro dos parênteses é o id de seu iframe, conforme código abaixo.


//aqui o script do iframe

<iframe name="alvo"  [b]id="Conteudo"[/b] scrolling="no" src="suapagina.html" frameborder="0" height="altura" width="largura"  marginheight="0" marginwidth="0"> </iframe>

Na página que será carregada dentro do iframe, use esse código:

 

<script language="JavaScript" type="text/javascript">
function EnviarTam(){
window.parent.mudarTamanho(document.body.offsetHeight);
}

e dentro da tag <body> proceda assim:

 

<body  onload="EnviarTam()">

Prontinho. O conteúdo se auto-ajustará no seu iframe.

 

É isso, espero que tenha ajudado.

 

 

 

E aee blza !!!

Achei o codigo muito interessante mas nao funcionou aqui pq sera ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá!

Estou com o mesmo problema, estou trabalhando com iframes, mas tendo problemas com o redimensionamento deles.

ahsc, tentei o seu script, que é muito legal, no entanto, ele só funcionou no Firefox, não funcionou nem no chrome, nem no ie... tem algum jeito de funcionar em qualquer browser?

Obrigada!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.