Início > Desenvolvimento > PNG transparente no IE6

PNG transparente no IE6

O IE 6 tem um problema com imagens de extensão “png”, ele não processa o Canal Alpha das imagens deixando toda a transparência em um tom esverdeado, estragando todo o layout.

Existem diversas soluções para resolver este problema, porém todas elas tem as suas limitações, principalmente quando o png é aplicado em um background via CSS.

O DD_belatedPNGé um JavaScript bem fácil de utilizar e que resolve este problema.

O arquivo está na pasta “js” do portal:  js/pngFundoTransparenteIE.js

A sua utilização é bem simples,  faça a chamada do arquivo dentro de comentários condicionais, para serem lidos apenas pelo IE 6 e inferiores.

Todos os elementos com o id “principal” e a classe “secundaria” terão a correção para PNG transparente.

<!--[if gte IE 5]>
  <script src="js/pngFundoTransparenteIE.js" type="text/javascript">
  </script>
    <script>
      DD_belatedPNG.fix('#principal');
      DD_belatedPNG.fix('.secundaria');
    </script>
  <![endif]-->

Outra forma de utilização é chamando os elementos DOM, alterando no script:

     DD_belatedPNG.fixPng(elemento DOM);

Para funcionar com todos os pngs eu fiz desta forma:

    DD_belatedPNG.fixPng('.*', '#*');

——

Neste momento estou utilizando o script para exibir as imagens do “Minha Página“, onde encontramos bastante degradê e imagens sobrepostas, deixando o layout com ótima qualidade nas imagens que possuem partes transparentes.

Relizei testes no IE 5.55 e 6.0.

Postado por Luciane Carvalho

  1. Ainda sem comentários.
  1. No trackbacks yet.

Deixe uma Resposta

Preencha os seus detalhes abaixo ou clique num ícone para iniciar sessão:

Logótipo da WordPress.com

Está a comentar usando a sua conta WordPress.com Terminar Sessão / Alterar )

Imagem do Twitter

Está a comentar usando a sua conta Twitter Terminar Sessão / Alterar )

Facebook photo

Está a comentar usando a sua conta Facebook Terminar Sessão / Alterar )

Google+ photo

Está a comentar usando a sua conta Google+ Terminar Sessão / Alterar )

Connecting to %s

%d bloggers like this: