Comments on: PNG alpha transparency, fast and easy

By: wilq32

wilq32 — Fri, 06 Feb 2009 08:54:07 +0000

IE freezing is because of DirectX Filter AlphaImageLoader that block whole browser until image to show is downloaded from internet. This is trival problem when dealing with few images, but this is unacceptable problem when u got lot images. There is second a lessknown solution that uses VML, but it makes download of images twice, and its worser for any animations. In fact PNG24 just sux for IE and its better to use PNG8 for IE6 only rather that using solutions that will freeze IE…

Read a little about problem with png here.

http://www.dcomments.com/Ajax/group7435/topic94945.htm

By: Brad

Brad — Thu, 10 Apr 2008 09:29:30 +0000

this script is a life saver, wasnt having much joy with the other fixes around but this is simple and WORKS!!

Thanks for saving me from a big headache!

By: Taha Paksu

Taha Paksu — Sat, 05 Apr 2008 22:06:21 +0000

If you are using jQuery lib in your project, this code may help you with the IE version checking and automatically adding styles to img tags with “.png” sources.

$(document).ready(function() { if(($.browser.msie)&(parseInt($.browser.version)<7)){ $("img[src$='.png']").each(function(){$(this).addClass("png");}); } });

By: The Three Marketeers » A site’s spine

The Three Marketeers » A site’s spine — Thu, 20 Mar 2008 09:42:29 +0000

[...] Transparantie: Met transparante PNG’tjes kun je de mooiste website maken, een klein probleempje IE5.5 of 6 kunnen hier niet mee werken. Gelukkig zijn er enkele kleine oplossingen voor, deze zijn in mijn laatste website toegepast. Deze werkt in alle browsers goed. De iepngfix.htc oplossing, goed voor achtergronden. En de perfecte oplossing voor normale plaatjes, via css! [...]

By: Technophreak

Technophreak — Sun, 26 Aug 2007 16:04:37 +0000

Here is something a bit more fancy I found out trying your suggestion:

img { display: expression( (/\.png$/.test( this.src.toLowerCase()) ? this.runtimeStyle.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + this.src + '")' : null), (/\.png$/.test( this.src.toLowerCase()) ? this.src = '/skins/common/images/spacer.gif' : null) ); }

By: WebPRO BrightLight » Blog Archive » Internet Explorer 7 is here

WebPRO BrightLight » Blog Archive » Internet Explorer 7 is here — Tue, 21 Aug 2007 14:40:30 +0000

[...] it’s a necessary step in the IE saga. IE7 finally has some cutting-edge technology such as PNG transparency or full CSS2 compatibility. Some say you can even use it as a browser So get it and please have [...]

By: Yuri

Yuri — Mon, 14 May 2007 15:47:28 +0000

This will alllow one to use transparent PNG for a background also, same class for an inline image or a container:


.trans-png  {
background-image: expression(
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + (this.tagName=='IMG' ? this['src'] : this.currentStyle['backgroundImage'].split('\"')[1]) + ")",
this.runtimeStyle.backgroundImage = "none",
this.src = "img/transparent.png",
this.width = this.style.width | this.clientWidth,
this.height = this.style.height | this.clientHeight
);
}

By: Better PNG Transparency Fix for IE Browser at Axel Segebrecht

Better PNG Transparency Fix for IE Browser at Axel Segebrecht — Thu, 29 Mar 2007 13:35:44 +0000

[...] I’ve previously used a complex Javascript solution for this, which resulted in much headache. Klaus Hartl posted a much improved and more light-weight solution on his Blog back in March 2006 – no idea why I haven’t found this [...]

By: Transparent PNGs in IE without javascript » GeoLand.org

Transparent PNGs in IE without javascript » GeoLand.org — Fri, 09 Mar 2007 12:50:47 +0000

[...] you want similar solutions take a look at Dean Edward’s IE7 PNG transparency script and Klaus Hartl’s PNG alpha transparency they are actually more flexible but they only work when javascript/jscript is [...]

By: GiorgosK

GiorgosK — Thu, 08 Mar 2007 20:52:51 +0000

You are right this hack needs javascript enabled just tested it.

I have a slightly different version that works with javascript disabled. Take a look here
I think the “expression” function is what needs javascript enabled.

NOTE: The hack I use is limited in that it can only be used for css background images, so Klaus’s script is definetelly more flexible.