Portal Tecnologia

Na figura abaixo podemos ver a estrutura básica de um sítio:

Div “Geral”, local aonde fica alocado conteúdo, rodapé, cabeçalho…

Div “Conteúdo”, conteúdo do site no nosso caso é aonde ficará o Iframe

Iframe a ser redimensionado.

O Iframe abrirá páginas com diferentes alturas (height). O tutorial tem como objetivo ensinar como redimensionar esse atributo.

1º Passo - Declaração do Iframe

<iframe name=”name_iframe” frameborder=”0″ src=”src_padrão” id=”id_iframe” scrolling=”no” width=”largura_iframe” height=”altura_inicial_iframe”></iframe>

2º Passo – Criar Div na página que abre dentro do Iframe:

<div id=”tamanho”>

Conteúdo

</div>

3º Passo – Inserir código JavaScript na página que abrirá dentro do Iframe:

<script language=”JavaScript” type=”text/javascript”> parent.document.getElementById(”id_do_iframe”).height = document.getElementById(”tamanho”).scrollHeight + 40;

</script>

Obs: Inserir Java Script depois do Div “Tamanho”

Esta função calcula a altura( height) do Div “Tamanho”, adicionando 40 pixels para margens e redimensiona a luta previamente definida no Iframe.

Espero que esse tutorial seja útil em situações do dia-a-dia.

Davi de Alencar
davi@portaltecnologia.net