I've finally figured out how to get transparent PNG files to work on a PC in IE. Most browsers have built in support for transparent PNGs for years but not IE on the PC. In order to get them to do work you must add some code....
1) create a new document with nothing in it but the following code and save it out as png.js
if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent) {
document.writeln('<style type="text/css">img { visibility:hidden; } </style>');
window.attachEvent("onload", fnLoadPngs);
}
function fnLoadPngs() {
var rslt = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
for (var i = document.images.length - 1, img = null; (img = document.images[i]); i--) {
if (itsAllGood && img.src.match(/\.png$/i) != null) {
var src = img.src;
img.style.width = img.width + "px";
img.style.height = img.height + "px";
img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='scale')"
img.src = "blank.gif";
}
img.style.visibility = "visible";
}
}
2) Download the following image and keep it with your code, it is needed to display the images correctly. blank.gif Right click on the link and 'save as'
3) Now in your document, the one you created with PNG files add this code before the </head> tag.
<script type="text/javascript" src="png.js"></script>
4) Enjoy!
This is what will happen. When your page loads up, it will load in the png.js javascript. That script will check if the user is in IE on a PC. If so it then uses blank.gif to do some magic and it will make all the transparent PNG files on that page look like they should.