Posted By

benjaminpearson on 01/04/11


Tagged

javascript ie transparency


Versions (?)

IE8 PNG Fading Transparency Fix


 / Published in: JavaScript
 

URL: http://stackoverflow.com/questions/1204457/how-to-solve-hack-fading-semi-transparent-png-bug-in-ie8

IE8 doesn't deal with fading transparent PNG - it's support of CSS opacity is broken. Including this code in the document.ready function allows you to use JQuery fading ,for example, on PNGs.

  1. // Fix for PNG transparency issue in IE when crossfading
  2. var i;
  3. for (i in document.images) {
  4. if (document.images[i].src) {
  5. var imgSrc = document.images[i].src;
  6. if (imgSrc.substr(imgSrc.length-4) === '.png' || imgSrc.substr(imgSrc.length-4) === '.PNG') {
  7. document.images[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + imgSrc + "')";
  8. }
  9. }
  10. }

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: notanothercliche on February 13, 2011

This works great! Question though, how can I apply this to div's with background PNG's?

See my disaster of a navigation here . . . http://www.notanothercliche.com/ Thankfully it only looks bad in ie8. Thank you Microsoft!

Posted By: promdress2011 on May 27, 2011

There are plenty of other prom dresses to getting your prom dress online, which include prom dresses, prom dresses, Plus-size prom dresses,you dont have to go out to find the discount prom dress – you can wait for the prom dress and wedding dresses, quinceanera dresses quinceanera dresses to come to you.

You need to login to post a comment.