Posted By

wizard04 on 01/15/09

Tagged

Versions (?)

Last Edited at 01/15/09 01:16pm

Statistics

Viewed 700 times

Favorited by 0 user(s)

Related snippets

Good IE6 PNG Fixes

/ Published in: JavaScript

There are several fixes out there that work in different ways, but none of them are perfect (especially regarding background images). Here's a list of the ones I've found that work reasonably well—try them out to find one that works for your web page.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

There are several IE PNG fixes out there that work in different ways, but none of them are perfect (especially regarding background images).  Here's a list of the ones I've found that work reasonably well--try them out to find one that works for your web page.
 
*********************************************************
DD_belatedPNG
http://www.dillerdesign.com/experiment/DD_belatedPNG/
 
Download the DD_belatedPNG javascript file
Edit the selector in the call to fix()
 
*** In HTML: ***
 
<!--[if IE 6]>
<script type="text/javascript" src="DD_belatedPNG_0.0.7a.js"></script>
<script type="text/javascript">DD_belatedPNG.fix("img, div");</script>
<![endif]-->
 
 
*********************************************************
IE PNG Alpha Fix
http://www.twinhelix.com/css/iepngfix/
 
Download iepngfix.htc and blank.gif
Edit the path to blank.gif in iepngfix.htc
Edit the selector in the inline CSS
 
*** In HTML: ***
 
<!--[if IE 6]>
<style type="text/css">
img, div { behavior: url(iepngfix.htc) }
</style>
<![endif]-->
 
 
*********************************************************
IE PNG FIX. CSS Solution
http://snipplr.com/view/4637ie-png-fix-css-solution/
This is basically the same as above, but put directly into the stylesheet instead of an .htc file
 
Download transparent.gif
Edit the selector in the inline CSS
 
*** In HTML: ***
 
<!--[if IE 6]>
<style type="text/css">
img, div {
    azimuth: expression(
        this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
        this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
        this.src = "/images/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
        this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
        this.runtimeStyle.backgroundImage = "none")),this.pngSet=true
 
    );
}
</style>
<![endif]-->