Posted By

alvaroisorna on 06/30/06


Tagged

javascript png internetexplorer opacity prototypejs


Versions (?)

Who likes this?

13 people have marked this snippet as a favorite

jonhenshaw
luman
bobbysmith007
helle
kaminogoya
panatlantica
j4k
kgosser
SpinZ
Hilyin
Merstzik
seanpowell
aegony


PNG Opacity support for Internet Explorer (simplified)


 / Published in: JavaScript
 

first try to a crossbrowser support for png's opacity support

  1. // this script have dependencies on prototype-1.4.0.js and Browser Detect Lite v2.1
  2. // http://prototype.conio.net/
  3. // http://www.dithered.com/javascript/browser_detect/index.html
  4. // (cc) alvaro isorna
  5.  
  6. Event.observe(window, 'load', function(){
  7. // this will iterate with each element with the class 'ie-fix-opacity' and add an IE filter,
  8. // replacing the background-image for the filter of that image
  9. document.getElementsByClassName('ie-fix-opacity').each(function(poElement){
  10. // if IE5.5+ on win32, then display PNGs with AlphaImageLoader
  11. if ((browser.isIE55 || browser.isIE6up) && browser.isWin32){
  12. var cBGImg = poElement.currentStyle.backgroundImage;
  13. var cImage = cBGImg.substring(cBGImg.indexOf('"') + 1, cBGImg.lastIndexOf('"'));
  14.  
  15. poElement.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + cImage + "', sizingMethod='scale')";
  16. poElement.style.backgroundImage = "none";
  17. }
  18. });
  19. }, false);

Report this snippet  

You need to login to post a comment.