1<public:component> 2<script type="text/javascript"> 3 4// IE5.5+ PNG Alpha Fix v2.0 Alpha 5// (c) 2004-2009 Angus Turnbull http://www.twinhelix.com 6 7// This is licensed under the GNU LGPL, version 2.1 or later. 8// For details, see: http://creativecommons.org/licenses/LGPL/2.1/ 9 10var IEPNGFix = window.IEPNGFix || {}; 11IEPNGFix.data = IEPNGFix.data || {}; 12 13 14// CONFIG: blankImg is the path to blank.gif, *relative to the HTML document*. 15// Try either: 16// * An absolute path like: '/images/blank.gif' 17// * A path relative to this HTC file like: thisFolder + 'blank.gif' 18var thisFolder = document.URL.replace(/(\\|\/)[^\\\/]*$/, '/'); 19IEPNGFix.blankImg = thisFolder + 'blank.gif'; 20 21 22IEPNGFix.fix = function(elm, src, t) { 23 // Applies an image 'src' to an element 'elm' using the DirectX filter. 24 // If 'src' is null, filter is disabled. 25 // Disables the 'hook' to prevent infinite recursion on setting BG/src. 26 // 't' = type, where background tile = 0, background = 1, IMG SRC = 2. 27 28 var h = this.hook.enabled; 29 this.hook.enabled = 0; 30 31 var f = 'DXImageTransform.Microsoft.AlphaImageLoader'; 32 src = (src || '').replace(/\(/g, '%28').replace(/\)/g, '%29'); 33 34 if ( 35 src && !(/IMG|INPUT/.test(elm.nodeName) && (t != 2)) && 36 elm.currentStyle.width == 'auto' && elm.currentStyle.height == 'auto' 37 ) { 38 if (elm.offsetWidth) { 39 elm.style.width = elm.offsetWidth + 'px'; 40 } 41 if (elm.clientHeight) { 42 elm.style.height = elm.clientHeight + 'px'; 43 } 44 if (elm.currentStyle.display == 'inline') { 45 elm.style.display = 'inline-block'; 46 } 47 } 48 49 if (t == 1) { 50 elm.style.backgroundImage = 'url("' + this.blankImg + '")'; 51 } 52 if (t == 2) { 53 elm.src = this.blankImg; 54 } 55 56 if (elm.filters[f]) { 57 elm.filters[f].enabled = src ? true : false; 58 if (src) { 59 elm.filters[f].src = src; 60 } 61 } else if (src) { 62 elm.style.filter = 'progid:' + f + '(src="' + src + 63 '",sizingMethod="' + (t == 2 ? 'scale' : 'crop') + '")'; 64 } 65 66 this.hook.enabled = h; 67}; 68 69 70IEPNGFix.process = function(elm, init) { 71 // Checks the onpropertychange event (on first 'init' run, a fake event) 72 // and calls the filter-applying-functions. 73 74 if ( 75 !/MSIE (5\.5|6)/.test(navigator.userAgent) || 76 typeof elm.filters == 'unknown' 77 ) { 78 return; 79 } 80 if (!this.data[elm.uniqueID]) { 81 this.data[elm.uniqueID] = { 82 className: '' 83 }; 84 } 85 var data = this.data[elm.uniqueID], 86 evt = init ? { propertyName: 'src,backgroundImage' } : event, 87 isSrc = /src/.test(evt.propertyName), 88 isBg = /backgroundImage/.test(evt.propertyName), 89 isPos = /width|height|background(Pos|Rep)/.test(evt.propertyName), 90 isClass = !init && ((elm.className != data.className) && 91 (elm.className || data.className)); 92 if (!(isSrc || isBg || isPos || isClass)) { 93 return; 94 } 95 data.className = elm.className; 96 var blank = this.blankImg.match(/([^\/]+)$/)[1], 97 eS = elm.style, 98 eCS = elm.currentStyle; 99 100 // Required for Whatever:hover - erase set BG if className changes. 101 if ( 102 isClass && (eS.backgroundImage.indexOf('url(') == -1 || 103 eS.backgroundImage.indexOf(blank) > -1) 104 ) { 105 return setTimeout(function() { 106 eS.backgroundImage = ''; 107 }, 0); 108 } 109 110 // Foregrounds. 111 if (isSrc && elm.src && { IMG: 1, INPUT: 1 }[elm.nodeName]) { 112 if ((/\.png/i).test(elm.src)) { 113 if (!elm.oSrc) { 114 // MM rollover compat 115 elm.oSrc = elm.src; 116 } 117 this.fix(elm, elm.src, 2); 118 } else if (elm.src.indexOf(blank) == -1) { 119 this.fix(elm, ''); 120 } 121 } 122 123 // Backgrounds. 124 var bgSrc = eCS.backgroundImage || eS.backgroundImage; 125 if ((bgSrc + elm.src).indexOf(blank) == -1) { 126 var bgPNG = bgSrc.match(/url[("']+(.*\.png[^\)"']*)[\)"']/i); 127 if (bgPNG) { 128 if (this.tileBG && !{ IMG: 1, INPUT: 1 }[elm.nodeName]) { 129 this.tileBG(elm, bgPNG[1]); 130 this.fix(elm, '', 1); 131 } else { 132 if (data.tiles && data.tiles.src) { 133 this.tileBG(elm, ''); 134 } 135 this.fix(elm, bgPNG[1], 1); 136 this.childFix(elm); 137 } 138 } else { 139 if (data.tiles && data.tiles.src) { 140 this.tileBG(elm, ''); 141 } 142 this.fix(elm, ''); 143 } 144 } else if ((isPos || isClass) && data.tiles && data.tiles.src) { 145 this.tileBG(elm, data.tiles.src); 146 } 147 148 if (init) { 149 this.hook.enabled = 1; 150 elm.attachEvent('onpropertychange', this.hook); 151 } 152}; 153 154 155IEPNGFix.childFix = function(elm) { 156 // "hasLayout" fix for unclickable children inside PNG backgrounds. 157 var tags = [ 158 'a', 159 'input', 160 'select', 161 'textarea', 162 'button', 163 'iframe', 164 'object' 165 ], 166 t = tags.length, 167 tFix = []; 168 while (t--) { 169 var pFix = elm.all.tags(tags[t]), 170 e = pFix.length; 171 while (e--) { 172 tFix.push(pFix[e]); 173 } 174 } 175 t = tFix.length; 176 if (t && (/relative|absolute/i).test(elm.currentStyle.position)) { 177 alert('IEPNGFix: Unclickable children of element:' + 178 '\n\n<' + elm.nodeName + (elm.id && ' id=' + elm.id) + '>'); 179 } 180 while (t--) { 181 if (!(/relative|absolute/i).test(tFix[t].currentStyle.position)) { 182 tFix[t].style.position = 'relative'; 183 } 184 } 185}; 186 187 188IEPNGFix.hook = function() { 189 if (IEPNGFix.hook.enabled) { 190 IEPNGFix.process(element, 0); 191 } 192}; 193 194 195IEPNGFix.process(element, 1); 196 197</script> 198</public:component> 199