Enviado para você por Penha através do Google Reader:
Muitos desenvolvedores não sabem, mas o IE6 e versões anteriores possuem um terrível problema com PNG's de 24 Bits, onde ele não processa o canal Alpha da imagem, com isso toda a transparência fica com o fundo meio "esverdeado" (problema esse já corrigido no IE7). Hoje em dia existem vários scripts que corrigem esse problema de transparência no IE, mas todos sofrem da mesma deficiência, que é a não implementação de background-position, background-repeat, link que não funciona entre outras coisas.
Já testei várias formas diferentes de correção, mas finalmente encontrei um script JS que funciona perfeitamente, onde é implementado o tão sonhado background-position e background-repeat, lhes apresento o DD_belatedPNG, um JavaScript extremamente pequeno, que em sua versão comprimida chega a aproximadamente 6KB. Sua utilização é extremamente simples, basta você baixar o arquivo JS e fazer uma chamada para o mesmo da seguinte forma dentro do header do seu site:
<!--[if IE 6]> <script src="DD_belatedPNG.js" type="text/javascript"></script> <script> /* Exemplo de utilizacao */ DD_belatedPNG.fix('.png_bg'); </script> < ![endif]-->
O Script foi inserido na página via comentários condicionais, para que seja lido somente pelo Internet Explorer 6 e menores, os outros browsers o consideram como um simples comentário HTML. Da forma citada, todos os elementos que possuírem a classe "png_bg" serão afetadas pelo Script as imagens começarão a funcionar corretamente. Uma outra forma de utilização é chamando os elementos DOM:
DD_belatedPNG.fixPng( seu elemento )
Exemplos
- PNG Transparente no IE6.
- PNG Transparente no IE6 com background-repeat.
- PNG Transparente no IE6 com background-position.
Isso pode lhe interessar:
- A Guerra dos Browsers
- Microsoft interessada em usar Webkit
- Descobri como o Internet Explorer 8 passou no Acid2 Test
- Dia Mundial sem o Internet Explorer
- Internet Explorer 6 R.I.P
Coisas que você pode fazer a partir daqui:
- Inscrever-se no Pinceladas da Web - Movido a XHTML, CSS e WebStandards usando o Google Reader
- Comece a usar o Google Reader para manter-se facilmente atualizado com todos os seus sites favoritos
0 comentários:
Postar um comentário