<?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>Raul Souza Lima - Blog &#187; Tutorial</title>
	<atom:link href="http://raulsouzalima.com/category/tutorial/feed/" rel="self" type="application/rss+xml" />
	<link>http://raulsouzalima.com</link>
	<description>Por Raul Souza Lima</description>
	<lastBuildDate>Mon, 25 Jan 2010 09:42:10 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>PNG Transparente no IE6</title>
		<link>http://raulsouzalima.com/2009/09/22/png-transparente-no-ie6/</link>
		<comments>http://raulsouzalima.com/2009/09/22/png-transparente-no-ie6/#comments</comments>
		<pubDate>Tue, 22 Sep 2009 19:10:03 +0000</pubDate>
		<dc:creator>Raul Souza Lima</dc:creator>
				<category><![CDATA[Jquery]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[ie6]]></category>
		<category><![CDATA[png transparente]]></category>

		<guid isPermaLink="false">http://raulsouzalima.com/?p=154</guid>
		<description><![CDATA[Já testei N formas de fazer png transparente funcionar no IE6, mas nenhuma delas tive tanto sucesso, umas não funcionavam com png em background e por ai vai&#8230; Eis que com um colega de trabalho (Douglas), aprendi uma forma eficiente utilizando Jquery e um plugin chamado DD_belatedPNG. Antes de explicar como fazer, segue uma demo. [...]]]></description>
			<content:encoded><![CDATA[<p>Já testei N formas de fazer png transparente funcionar no IE6, mas nenhuma delas tive tanto sucesso, umas não funcionavam com png em background e por ai vai&#8230;</p>
<p>Eis que com um colega de trabalho (Douglas), aprendi uma forma eficiente utilizando  <a title="Jquery" href="http://jquery.com" target="_blank">Jquery</a> e um plugin chamado <a title="DD_belatedPNG" href="http://www.dillerdesign.com/experiment/DD_belatedPNG/" target="_blank">DD_belatedPNG</a>.</p>
<p>Antes de explicar como fazer, segue uma <a title="PNG Fix - IE6" href="http://lab.webxperience.com.br/pngfix/" target="_blank">demo</a>.</p>
<p>Vamos ao funcionamento:</p>
<p>Baixe e adicione o Jquery a sua página.</p>
<pre class="javascript"><code>&lt;script type=<span class="st0">"text/javascript"</span> src=<span class="st0">"js/jquery-1.3.2.min.js"</span>&gt;&lt;/script&gt;</code></pre>
<p>Baixe e adicione entre um comentário condicional o plugin DD_belatedPNG.</p>
<pre class="javascript"><code>&lt;!--<span class="br0">[</span><span class="kw1">if</span> IE <span class="nu0">6</span><span class="br0">]</span>&gt;
&lt;script type=<span class="st0">"text/javascript"</span> src=<span class="st0">"js/DD_belatedPNG_0.0.8a.js"</span>&gt;&lt;/script&gt;
&lt;!<span class="br0">[</span>endif<span class="br0">]</span>--&gt;</code></pre>
<p>Ainda dentro do comentário condicional adicione o seguinte script:</p>
<pre class="javascript"><code>&lt;script type=<span class="st0">"text/javascript"</span>&gt;
jQuery<span class="br0">(</span><span class="kw2">function</span><span class="br0">(</span><span class="br0">)</span> <span class="br0">{</span>
	<span class="kw1">if</span><span class="br0">(</span>!<span class="re0">/msie <span class="br0">[</span>^<span class="nu0">6</span><span class="br0">]</span>\.<span class="nu0">0</span>/i.<span class="me1">test</span><span class="br0">(</span>navigator.<span class="me1">userAgent</span><span class="br0">)</span> &amp;&amp; /msie <span class="nu0">6</span>\.<span class="nu0">0</span>/i</span>.<span class="me1">test</span><span class="br0">(</span>navigator.<span class="me1">userAgent</span><span class="br0">)</span><span class="br0">)</span><span class="br0">{</span>
		DD_belatedPNG.<span class="me1">fix</span><span class="br0">(</span><span class="st0">'img, .pngfix'</span><span class="br0">)</span>;
	<span class="br0">}</span>;
<span class="br0">}</span><span class="br0">)</span>;
&lt;/script&gt;</code></pre>
<p>Esse script verifica se o browser é mesmo o IE6 e executa o script caso o png esteja dentro de uma tag img, sendo assim é automático. Caso o png esteja como background de um texto por exemplo, basta add a <strong>class &#8220;pngfix&#8221;.</strong></p>
<p>Simples, é isso!</p>
]]></content:encoded>
			<wfw:commentRss>http://raulsouzalima.com/2009/09/22/png-transparente-no-ie6/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
