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