Greenguy's Board - Does the newer versions of IE support transparency with png images?

Greenguy's Board (http://www.greenguysboard.com/board/index.php)

- Programming & Scripting (http://www.greenguysboard.com/board/forumdisplay.php?f=15)

- - Does the newer versions of IE support transparency with png images? (http://www.greenguysboard.com/board/showthread.php?t=54244)

Does the newer versions of IE support transparency with png images?

The thread title pretty much says what I'm asking.

I know IE 6 doesn't support transparency with png images but was wondering if 7 or 8 or whatever version IE is up to now supports ransparency with png images.

Good to know. I've been using a transparent png as the start button in Flowplayer and wow does it look fugly in IE 6.

Cleo
If you still care or want transparency in PNG to work in older IE versions,this is a nice fix for that.

http://www.twinhelix.com/css/iepngfix/demo/

Quote:

Originally Posted by pclit (Post 464329)

Cleo
If you still care or want transparency in PNG to work in older IE versions,this is a nice fix for that.

http://www.twinhelix.com/css/iepngfix/demo/

Interesting,
Seems like way too much hassle to give users of old versions of IE a pretty start button in FlowPlayer though.

All you need to do is to place this in your section :

and have that iepngfix.htc in place
That should do the trick.

I can't check that on my laptop. I don't have IE5 or 6 or 7

Note to anybody with older IE version:
http://www.twinhelix.com/css/iepngfix/demo/
Is demo image on right side transparent ?

Just tried it in IE 6. It does some funky things.
http://www.greenguysboard.com/board/...2&d=1253116849

I generally just use a filter to make a color transparent, and it works on all image types.

Not sure if it's completely CSS compliant though but works in IE.

To drop red:
filter: chroma(color='#ff0000);

http://www.queness.com/post/683/10-a...bugs-and-fixes

few more handy tricks for crappy IE

png transparency work just fine with ie7 and ie8

for older versions like ie6 the best option i think is trough css
instead of having the image in img tag you can just place and empty span and then assign class to this span with the following:

Code:

background:url(noimage.gif);

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='path_to_png_image', sizingMethod='scale');

i have a simple piece of js code that makes this automatically for all the png's on the page (just place it before the ending body tag):

Code:

if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){

 var ieversion=new Number(RegExp.$1)



 if (ieversion == 7) 

{

   for(var i=0; i
   {

      var img = document.images[i]

      var imgName = img.src.toUpperCase()

      if (imgName.substring(imgName.length-3, imgName.length) == "PNG")

      {

         var imgID = (img.id) ? "id='" + img.id + "' " : ""

         var imgClass = (img.className) ? "class='" + img.className + "' " : ""

         var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "

         var imgStyle = "display:inline-block;" + img.style.cssText 

         if (img.align == "left") imgStyle = "float:left;" + imgStyle

         if (img.align == "right") imgStyle = "float:right;" + imgStyle

         if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle

         var strNewHTML = "
         + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"

         + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"

         + "(src=\'" + img.src + "\', sizingMethod='scale');\">" 

         img.outerHTML = strNewHTML

         i = i-1

      }

   }

}