Transparent fix af png i explorer

 

Hvis du vil brugegennemsigtige png filer istedet for gif har du et problem i IE 5.5 og op efter, da IE 5.5 og op efter ikke kan vise PNG alpha transparency ordentlig, virker kun hvis man hjælper IE med på vejen.

Brug følgene kode

Indsæt i html head:


<SCRIPT LANGUAGE="JavaScript1.1">
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";
}
}


</script>


I body indsætter du normal img kode så vil din javascript i head automatisk rette IE.

<img src="din-png-fil.png" width="200" height="100">


Husk at lave en gif fil som hedder eks. blank.gif som er 100% transparent, se filnavnet i javascript koden

Hvad er fordelen ved png?
Fordelen er at din transparent er flottere end med gif som kun kan lave 1 transparent farve.



Skrevet af: | Dato : 2005-09-15 10:4 | Læst : 9878 gange