Ir para conteúdo

POWERED BY:

Arquivado

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

Godoi

Iframe auto-austavel

Por , em Javascript

Recommended Posts

Godoi    0

Godoi
Postado

Pois é povo.. sou novo no forum... e se alguem me ajudasse seria muito bom http://forum.imasters.com.br/public/style_emoticons/default/grin.gif

 

eu estou com uma pagina em html... e nela eu tenho um Iframe.. e gostaria que este Iframe ajustasse a altura (heigth) dele automaticamente de acordo com o conteudo que for pra dentro dele...

 

 

segue meu index.html (com o javascript que eu vi em um tutorial em algum lugar)

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>:: Jsantos Imobiliária</title><style type=text/css>@import url( folha_de_estilo.css );</style><script language="JavaScript" type="text/JavaScript">function muda_frame ( ifram , valor ) {var oFrame = document.all (ifram);oFrame.style.height = valor;}</script></head><body><!--Inicio do Menu de topo e imagem de logo--><table width="700" height="100" border="0" align="center" cellpadding="0" cellspacing="0">  <tr>    <td height="100"><img src="images/logo.jpg" width="300" height="100" /></td>    <td width="400">		<div id="menu">			<ul>			 <li><a href="#">HOME</a></li>			 <li><a href="#">VENDA</a></li>			 <li><a href="#">ALUGUEL</a></li>		 	 <li><a href="#">A EMPRESA</a></li>			 <li><a href="#">CONTATO</a></li>			</ul>		</div>	</td>  </tr></table><!--Fim do Menu de topo e imagem de logo--><!--Inicio do Corpo de Frame--><table width="700" border="0"  align="center" cellspacing="0" cellpadding="0">  <tr>    <td><iframe nome="conteudo" frameborder="0" scrolling="no" src="teste.htm" width="700"></iframe></td>  </tr></table><!--Final do Corpo de Frame--><!--Corpo parceiros--><table width="700" border="0" align="center" cellpadding="0" cellspacing="0">  <tr>    <td> </td>  </tr></table><!--Final Corpo parceiros--><!--Inicio do Rodapé--><table width="700" border="0" align="center" cellpadding="0" cellspacing="0">  <tr>    <td width="6" height="60" background="images/botton_e.jpg"> </td>    <td background="images/botton_midle.jpg" class="style1"><div align="center" class="style2"><em>© 2007 Jsantos Imobiliária. Todos os direitos   reservados.</em></div></td>    <td width="6" background="images/botton_d.jpg"> </td>  </tr></table><!--Final do Rodapé--><!--Rodapé design--><table width="700" border="0" align="center" cellpadding="0" cellspacing="0">  <tr>    <td class="style3"><div align="right"><em>Webmaster: Raphael Godoi Rocca    </em></div></td>  </tr></table><!--Fim Rodapé design--></body></html>

 

Agora o codigo do conteudo que vai ser inserido dentro do iframe...

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title></head><body><table width="700" border="0" cellspacing="0" cellpadding="0" id="cont">  <tr>    <td>	<p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>aa</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p>a</p>    <p> </p></td>  </tr></table><script language=JavaScript>window.parent.muda_frame(window.name,document.all.cont.clientHeight);</SCRIPT></body></html>

 

Obs: o conteudo do iframe ai é soh para testar se ele ajusta automaticamente a altura...

 

Obs2: varios "conteudos" serao inseridos nesse mesmo iframe...

 

 

É isso ai galera.. pesso que me ajudem... Obrigado

Compartilhar este post

Link para o post
Compartilhar em outros sites

Kikitten    0

Kikitten
Postado

Bom já responderam mas parece que o que eu uso é mais simples.

 

Iframe normal na index

 

<iframe id="iframe" name="nome do iframe o mesmo q poe nos links" src="url" frameborder="no" width="largura" height="100%" scrolling="No"></iframe>

e a página q abre dentro do iframe... todas elas devem estar assim... quando eu digo devem estar assim... estou falando do lugar para posicionar o script e o id... estou explicando ali embaixo

<html><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Curso</title><link rel="stylesheet" type="text/css" media="screen" href="pagecss.css" /><body><table id="tamanho" width="550" border="0" cellspacing="0" cellpadding="0">    <tr>		<th bgcolor="#b9cee6" align="center"><strong>Objetivo</strong></td>  </tr>  <tr>		<td><p align="justify">Formar profissionais com capacidade de compreensão analítica do contexto macro-social e habilidades para atuar de forma empreendedora, pró-ativa e eticamente no contexto de contínuas mudanças e maiores exigências de qualidade das organizações.</p>	<p> </p></td>  </tr>   </table><script language="JavaScript" type="text/javascript">  parent.document.getElementById("iframe").height = document.getElementById("tamanho").scrollHeight + 20; //40: Margem Superior e Inferior, somadas</script></body></html>

O script você coloca por ultimo antes ta tag /body 

<script language="JavaScript" type="text/javascript">  parent.document.getElementById("iframe").height = document.getElementById("tamanho").scrollHeight + 20; //40: Margem Superior e Inferior, somadas</script>

E o documento precisa ter uma ID... que nesse caso foi chamado de tamanho 

<table id="tamanho" width="550" border="0" cellspacing="0" cellpadding="0">

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito