<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Portal Tecnologia &#187; Javascript</title>
	<atom:link href="http://www.portaltecnologia.net/category/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.portaltecnologia.net</link>
	<description>Seu portal em tecnologia da informação</description>
	<lastBuildDate>Mon, 12 Dec 2011 11:12:03 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Tutorial &#8211; Redimensionando height de Iframe com JavaScript</title>
		<link>http://www.portaltecnologia.net/2008/04/14/tutorial-redimensionando-height-de-iframe-com-javascript/</link>
		<comments>http://www.portaltecnologia.net/2008/04/14/tutorial-redimensionando-height-de-iframe-com-javascript/#comments</comments>
		<pubDate>Mon, 14 Apr 2008 21:59:16 +0000</pubDate>
		<dc:creator>Davi Alencar</dc:creator>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[Javascript]]></category>

		<guid isPermaLink="false">http://www.portaltecnologia.net/2008/04/14/tutorial-redimensionando-height-de-iframe-com-javascript/</guid>
		<description><![CDATA[Na figura abaixo podemos ver a estrutura básica de um sítio: Div “Geral”, local aonde fica alocado conteúdo, rodapé, cabeçalho&#8230; 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. [...]]]></description>
			<content:encoded><![CDATA[<p class="MsoNormal">Na figura abaixo podemos ver a estrutura básica de um sítio:</p>
<p><img src="http://www.portaltecnologia.net/wp-content/uploads/2008/04/img1.jpg" alt="Tutorial - Redimensionando height de Iframe com JavaScript - imagem 1" height="448" width="520" /></p>
<p class="MsoNormal"><strong>Div “Geral”</strong>, local aonde fica alocado conteúdo, rodapé, cabeçalho&#8230;</p>
<p class="MsoNormal"><strong>Div “Conteúdo”</strong>, conteúdo do site no nosso caso é aonde ficará o Iframe</p>
<p class="MsoNormal"><strong>Iframe</strong> a ser redimensionado.<o:p><br />
</o:p></p>
<p class="MsoNormal">O Iframe abrirá páginas com diferentes alturas (height). O tutorial tem como objetivo ensinar como redimensionar esse atributo.<o:p> </o:p></p>
<p class="MsoNormal"><strong>1º Passo &#8211; <span> </span>Declaração do Iframe</strong></p>
<p class="MsoNormal"><o:p></o:p><span lang="EN-US"><font color="#ff0000">&lt;iframe name=&#8221;name_iframe&#8221; frameborder=&#8221;0&#8243; src=&#8221;src_padrão&#8221; id=&#8221;id_iframe&#8221; scrolling=&#8221;no&#8221; width=&#8221;largura_iframe&#8221; height=&#8221;altura_inicial_iframe&#8221;&gt;&lt;/iframe&gt;</font><o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-US"><o:p></o:p></span><strong>2º Passo – Criar Div na página que abre dentro do Iframe:</strong></p>
<p class="MsoNormal"><o:p> </o:p><font color="#ff0000">&lt;div id=&#8221;tamanho&#8221;&gt;</font></p>
<p class="MsoNormal"><font color="#ff0000"><o:p> </o:p></font></p>
<p class="MsoNormal"><font color="#ff0000">Conteúdo</font></p>
<p class="MsoNormal"><font color="#ff0000"><o:p> </o:p></font></p>
<p class="MsoNormal"><font color="#ff0000">&lt;/div&gt;</font></p>
<p class="MsoNormal"><o:p> </o:p><br />
<strong>3º Passo – Inserir código JavaScript na página que abrirá dentro do Iframe:</strong></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p align="left"><font color="#ff0000"><span>&lt;script language=&#8221;JavaScript&#8221; type=&#8221;text/javascript&#8221;&gt; </span>parent.document.getElementById(&#8220;id_do_iframe&#8221;).height = document.getElementById(&#8220;tamanho&#8221;).scrollHeight + 40; <o:p></o:p></font></p>
<p class="MsoNormal"><font color="#ff0000">&lt;/script&gt;</font></p>
<p class="MsoNormal"><o:p> </o:p><strong>Obs:</strong> Inserir Java Script depois do Div “Tamanho”</p>
<p class="MsoNormal"> <o:p></o:p><br />
Esta função calcula a altura( height) do Div “Tamanho”, adicionando 40 pixels para margens e redimensiona a luta previamente definida no Iframe.</p>
<p class="MsoNormal">Espero que esse tutorial seja útil em situações do dia-a-dia.</p>
<p class="MsoNormal"> Davi de Alencar<br />
<a href="mailto:davi@portaltecnologia.net">davi@portaltecnologia.net</a></p>
<p class="MsoNormal">&nbsp;</p>
<p class="MsoNormal">&nbsp;</p>
<a href="http://www.facebook.com/share.php?u=http%3A%2F%2Fwww.portaltecnologia.net%2F2008%2F04%2F14%2Ftutorial-redimensionando-height-de-iframe-com-javascript%2F&amp;t=Tutorial%20-%20Redimensionando%20height%20de%20Iframe%20com%20JavaScript" id="facebook_share_button_155" style="font-size:11px; line-height:13px; font-family:'lucida grande',tahoma,verdana,arial,sans-serif; text-decoration:none; display: -moz-inline-block; display:inline-block; padding:1px 20px 0 5px; margin: 5px 0; height:15px; border:1px solid #d8dfea; color: #3B5998; background: #fff url(http://b.static.ak.fbcdn.net/images/share/facebook_share_icon.gif) no-repeat top right;">Share</a>
	<script type="text/javascript">
	<!--
	var button = document.getElementById('facebook_share_link_155') || document.getElementById('facebook_share_icon_155') || document.getElementById('facebook_share_both_155') || document.getElementById('facebook_share_button_155');
	if (button) {
		button.onclick = function(e) {
			var url = this.href.replace(/share\.php/, 'sharer.php');
			window.open(url,'sharer','toolbar=0,status=0,width=626,height=436');
			return false;
		}
	
		if (button.id === 'facebook_share_button_155') {
			button.onmouseover = function(){
				this.style.color='#fff';
				this.style.borderColor = '#295582';
				this.style.backgroundColor = '#3b5998';
			}
			button.onmouseout = function(){
				this.style.color = '#3b5998';
				this.style.borderColor = '#d8dfea';
				this.style.backgroundColor = '#fff';
			}
		}
	}
	-->
	</script>
	<div class="tweetthis" style="text-align:left;"><p> <a target="_blank" rel="nofollow" class="tt" href="http://twitter.com/intent/tweet?text=Tutorial+%E2%80%93+Redimensionando+height+de+Iframe+com+JavaScript+http%3A%2F%2Fportaltecnologia.net%2F%3Fp%3D155" title="Post to Twitter"><img class="nothumb" src="http://www.portaltecnologia.net/wp-content/plugins/tweet-this/icons/en/twitter/tt-twitter6.png" alt="Post to Twitter" /></a></p></div><div style='display:none' id="post-refEl-155"></div>]]></content:encoded>
			<wfw:commentRss>http://www.portaltecnologia.net/2008/04/14/tutorial-redimensionando-height-de-iframe-com-javascript/feed/</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
	</channel>
</rss>

