Posted By

elightbo on 09/28/09


Tagged

javascript png textmate


Versions (?)

IE png fix


 / Published in: Other
 

  1. <public:component>
  2. <public:attach event="onpropertychange" onevent="iePNGFix(0)" />
  3.  
  4. <script type="text/javascript">
  5.  
  6. // IE5.5+ PNG Alpha Fix v1.0
  7. // (c) 2004-2008 Angus Turnbull http://www.twinhelix.com
  8.  
  9. // This is licensed under the GNU LGPL, version 2.1 or later.
  10. // For details, see: http://creativecommons.org/licenses/LGPL/2.1/
  11.  
  12.  
  13. // This must be a path to a blank image, relative to the HTML document(s).
  14. // In production use I suggest '/images/blank.gif' or similar. That's all!
  15. if (typeof blankImg == 'undefined') var blankImg = '/changename/files/images/blank.gif';
  16.  
  17.  
  18.  
  19. function filt(s, b)
  20. {
  21. var f = 'DXImageTransform.Microsoft.AlphaImageLoader';
  22. var sM = (currentStyle.backgroundRepeat == 'no-repeat') ? 'crop' : 'scale';
  23. s = (s || '').replace(/(/g, '%28').replace(/)/g, '%29');
  24.  
  25. if (s && !(/IMG|INPUT/.test(nodeName) && !b) &&
  26. currentStyle.width == 'auto' && currentStyle.height == 'auto')
  27. {
  28. style.width = offsetWidth + 'px';
  29. style.height = clientHeight + 'px';
  30. if (currentStyle.display == 'inline') style.display = 'inline-block';
  31. }
  32.  
  33. if (filters[f])
  34. {
  35. filters[f].enabled = s ? true : false;
  36. if (s) with (filters[f]) { src = s }
  37. }
  38. else if (s) style.filter = 'progid:'+f+'(src="'+s+'",sizingMethod="' + sM + '")';
  39. }
  40.  
  41. function iePNGFix(init)
  42. {
  43. if (!/MSIE (5.5|6)/.test(navigator.userAgent) || typeof filters == 'unknown') return;
  44. var evt = init ? { propertyName: 'src,background' } : event;
  45. var isSrc = /src/.test(evt.propertyName);
  46. var isBg = /background/.test(evt.propertyName);
  47. var isClass = !init &&
  48. ((this.className != this._png_class) && (this.className || this._png_class));
  49. if (!(isSrc || isBg || isClass)) return;
  50. this._png_class = this.className;
  51. var blank = blankImg.match(/([^/]+)$/)[1];
  52.  
  53. // Required for Whatever:hover support - erase any set BG if className changes.
  54. if (isClass && ((style.backgroundImage.indexOf('url(') == -1) ||
  55. (style.backgroundImage.indexOf(blank) > -1)))
  56. {
  57. setTimeout(function() { this.style.backgroundImage = '' }, 0);
  58. return;
  59. }
  60.  
  61. if (isSrc && this.src && /IMG|INPUT/.test(nodeName))
  62. {
  63. if ((/.png/i).test(src))
  64. {
  65. filt(src, 1);
  66. src = blankImg;
  67. }
  68. else if (src.indexOf(blank) == -1) filt();
  69. }
  70.  
  71. var bgSrc = currentStyle.backgroundImage || style.backgroundImage;
  72. if ((bgSrc + this.src).indexOf(blank) == -1)
  73. {
  74. var bgPNG = bgSrc.match(/^url[("']+(.*.png[^)"']*)[)"']+[^)]*$/i);
  75.  
  76. if (bgPNG)
  77. {
  78. style.backgroundImage = 'url("' + blankImg + '")';
  79. filt(bgPNG[1], 0);
  80. // Unclickable elements inside PNG backgrounds.
  81. var tags = ['a', 'input', 'select', 'textarea', 'iframe', 'object'],
  82. t = tags.length, tFix = [];
  83. while (t--)
  84. {
  85. var elms = all.tags(tags[t]), e = elms.length;
  86. while (e--) tFix.push(elms[e]);
  87. }
  88. var t = tFix.length;
  89. if (t && (/relative|absolute/i).test(currentStyle.position))
  90. alert('IEPNGFix: Children of positioned element are unclickable:nn<' +
  91. nodeName + (id && ' id=' + id) + '>');
  92. while (t--)
  93. if (!(/relative|absolute/i).test(tFix[t].currentStyle.position))
  94. tFix[t].style.position = 'relative';
  95. }
  96. else filt();
  97. }
  98. }
  99.  
  100. iePNGFix(1);
  101.  
  102. </script>
  103. </public:component>
  104.  

Report this snippet  

You need to login to post a comment.