Skip to content

Commit

Permalink
IE has been hacked, including transparent PNGs
Browse files Browse the repository at this point in the history
  • Loading branch information
Matthew Anderson committed Jan 19, 2009
1 parent fdecd29 commit 8d7c2d8
Show file tree
Hide file tree
Showing 4 changed files with 230 additions and 6 deletions.
Binary file added blank.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
20 changes: 17 additions & 3 deletions css/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
FILENAME: globals.css
DESCRIPTION: This stylesheet serves global declarations to all University of Iowa assets
AUTHOR: Matthew Anderson -> matthew.anderson.design@gmail.com
LAST MODIFIED DATE: 01.13.2009
LAST MODIFIED DATE: 01.18.2009
*/

/* =GRID OVERRIDE */
Expand All @@ -21,6 +21,7 @@ body {
body {
background: #0a0a0a;
font: normal 16px/20px 'Helvetica Neue', Helvetica, Arial, sans-serif; /* normalize font size across browsers */
text-align: left;
color: #fff;
}

Expand All @@ -45,6 +46,10 @@ a, strong, b { /* Straightens out OS X font rendering */

/* =GRID =MODIFIERS */

/*.container_16 {
overflow: hidden;
}*/

.container_16:after{clear:both;content:'.';display:block;visibility:hidden;height:0}
.container_16{display:inline-block}
* html .container_16{height:1%}
Expand All @@ -61,6 +66,7 @@ li.alpha {
/* =BANNER */

#banner {
clear: both;
background: #16171c url("../images/bg_banner.png") top center no-repeat;
height: 80px;
margin: 40px 0;
Expand Down Expand Up @@ -116,6 +122,12 @@ li.alpha {
width: 80px;
}

/* =CONTENT */

#content {
clear: both;
}

/* =FOOTER */

#footer {
Expand Down Expand Up @@ -163,6 +175,7 @@ h2 {

h3 {
margin-bottom: 20px;
line-height: 20px;
font-size: .875em;
font-weight: normal;
text-align: center;
Expand All @@ -175,6 +188,7 @@ hr {
clear: both;
height: 1px;
margin: 0 10px 19px 10px;
padding: 0;
border: 0;
border-top: 1px solid #1f2024;
}
Expand Down Expand Up @@ -209,7 +223,7 @@ hr {

#actors ul li a {
display: block;
background-position: 0 0;
background-position: 0px 0px;
background-repeat; no-repeat
width: 235px;
padding: 80px 0;
Expand Down Expand Up @@ -352,7 +366,7 @@ hr {

#dome img {
display: block;
margin: 0 auto;
margin: 0 auto 20px auto;
}

/* =BUTTONS =BASE */
Expand Down
29 changes: 26 additions & 3 deletions css/iehacks.css
Original file line number Diff line number Diff line change
@@ -1,10 +1,33 @@
/*
FILENAME: globals.css
DESCRIPTION: This stylesheet serves global declarations to all MattLovesLinz.com assets
AUTHOR: Matthew Anderson -> manderson@onehub.com
LAST MODIFIED DATE: 11.02.2008
DESCRIPTION: This stylesheet serves global declarations to all iowaactors.com assets
AUTHOR: Matthew Anderson -> matthew.anderson.design@gmail.com
LAST MODIFIED DATE: 01.18.2009
*/

/* Hides from IE-Mac \*/

img, #logo span, #logo a { behavior: url(iepngfix.htc) }

body, #dome img {
text-align: center;
}

#content {
text-align: left;
}

h1 {
font-size: 38px;
letter-spacing: -3px;
}

#actors ul li a {
zoom: 1;
}

.actor .affiliation {
bottom: -5px;
}

/* End hide from IE-Mac */
187 changes: 187 additions & 0 deletions iepngfix.htc
Original file line number Diff line number Diff line change
@@ -0,0 +1,187 @@
<public:component>
<script type="text/javascript">

// IE5.5+ PNG Alpha Fix v2.0 Alpha
// (c) 2004-2008 Angus Turnbull http://www.twinhelix.com

// This is licensed under the GNU LGPL, version 2.1 or later.
// For details, see: http://creativecommons.org/licenses/LGPL/2.1/

var IEPNGFix = window.IEPNGFix || {};
IEPNGFix.data = IEPNGFix.data || {};


// This must be a path to a blank image, relative to the HTML document(s).
// In production use I suggest '/images/blank.gif' or similar. That's all!
IEPNGFix.blankImg = 'blank.gif';


IEPNGFix.fix = function(elm, src, t) {
// Applies an image 'src' to an element 'elm' using the DirectX filter.
// If 'src' is null, filter is disabled.
// Disables the 'hook' to prevent infinite recursion on setting BG/src.
// 't' = type, where background tile = 0, background = 1, IMG SRC = 2.

var h = this.hook.enabled;
this.hook.enabled = 0;

var f = 'DXImageTransform.Microsoft.AlphaImageLoader';
src = (src || '').replace(/\(/g, '%28').replace(/\)/g, '%29');

if (
src && !(/IMG|INPUT/.test(elm.nodeName) && (t != 2)) &&
elm.currentStyle.width == 'auto' && elm.currentStyle.height == 'auto'
) {
elm.style.width = elm.offsetWidth + 'px';
elm.style.height = elm.clientHeight + 'px';
if (elm.currentStyle.display == 'inline') {
elm.style.display = 'inline-block';
}
}

if (t == 1) {
elm.style.backgroundImage = 'url("' + this.blankImg + '")';
}
if (t == 2) {
elm.src = this.blankImg;
}

if (elm.filters[f]) {
elm.filters[f].enabled = src ? true : false;
if (src) {
elm.filters[f].src = src;
}
} else if (src) {
elm.style.filter = 'progid:' + f + '(src="' + src +
'",sizingMethod="' + (t == 2 ? 'scale' : 'crop') + '")';
}

this.hook.enabled = h;
};


IEPNGFix.process = function(elm, init) {
// Checks the onpropertychange event (on first 'init' run, a fake event)
// and calls the filter-applying-functions.

if (
!/MSIE (5\.5|6)/.test(navigator.userAgent) ||
typeof elm.filters == 'unknown'
) {
return;
}
if (!this.data[elm.uniqueID]) {
this.data[elm.uniqueID] = {
className: ''
};
}
var data = this.data[elm.uniqueID],
evt = init ? { propertyName: 'src,backgroundImage' } : event,
isSrc = /src/.test(evt.propertyName),
isBg = /backgroundImage/.test(evt.propertyName),
isPos = /width|height|background(Pos|Rep)/.test(evt.propertyName),
isClass = !init && ((elm.className != data.className) &&
(elm.className || data.className));
if (!(isSrc || isBg || isPos || isClass)) {
return;
}
data.className = elm.className;
var blank = this.blankImg.match(/([^\/]+)$/)[1],
eS = elm.style,
eCS = elm.currentStyle;

// Required for Whatever:hover - erase set BG if className changes.
if (
isClass && (eS.backgroundImage.indexOf('url(') == -1 ||
eS.backgroundImage.indexOf(blank) > -1)
) {
return setTimeout(function() {
eS.backgroundImage = '';
}, 0);
}

// Foregrounds.
if (isSrc && elm.src && { IMG: 1, INPUT: 1 }[elm.nodeName]) {
if ((/\.png/i).test(elm.src)) {
this.fix(elm, elm.src, 2);
} else if (elm.src.indexOf(blank) == -1) {
this.fix(elm, '');
}
}

// Backgrounds.
var bgSrc = eCS.backgroundImage || eS.backgroundImage;
if ((bgSrc + elm.src).indexOf(blank) == -1) {
var bgPNG = bgSrc.match(/url[("']+(.*\.png[^\)"']*)[\)"']/i);
if (bgPNG) {
if (this.tileBG && !{ IMG: 1, INPUT: 1 }[elm.nodeName]) {
this.tileBG(elm, bgPNG[1]);
this.fix(elm, '', 1);
} else {
if (data.tiles && data.tiles.src) {
this.tileBG(elm, '');
}
this.fix(elm, bgPNG[1], 1);
this.childFix(elm);
}
} else {
if (data.tiles && data.tiles.src) {
this.tileBG(elm, '');
}
this.fix(elm, '');
}
} else if ((isPos || isClass) && data.tiles && data.tiles.src) {
this.tileBG(elm, data.tiles.src);
}

if (init) {
this.hook.enabled = 1;
elm.attachEvent('onpropertychange', this.hook);
}
};


IEPNGFix.childFix = function(elm) {
// "hasLayout" fix for unclickable children inside PNG backgrounds.
var tags = [
'a',
'input',
'select',
'textarea',
'button',
'iframe',
'object'
],
t = tags.length,
tFix = [];
while (t--) {
var pFix = elm.all.tags(tags[t]),
e = pFix.length;
while (e--) {
tFix.push(pFix[e]);
}
}
t = tFix.length;
if (t && (/relative|absolute/i).test(elm.currentStyle.position)) {
alert('IEPNGFix: Unclickable children of element:' +
'\n\n<' + elm.nodeName + (elm.id && ' id=' + elm.id) + '>');
}
while (t--) {
if (!(/relative|absolute/i).test(tFix[t].currentStyle.position)) {
tFix[t].style.position = 'relative';
}
}
};


IEPNGFix.hook = function() {
if (IEPNGFix.hook.enabled) {
IEPNGFix.process(element, 0);
}
};


IEPNGFix.process(element, 1);

</script>
</public:component>

0 comments on commit 8d7c2d8

Please sign in to comment.