chrisburton

# December 30, 2012 at 7:14 pm

@dfogge Incredible, thank you! Is there any possible way to support IE9+?

Andy Howells

# December 30, 2012 at 7:25 pm

Am I right in saying that this code basically;

• Replaces the image src with the mask.
• Adds a CSS background of the original image to the element.
• Mask has a hole in it in the shape of what you want? (Transparent).

chrisburton

# December 30, 2012 at 7:33 pm

Even if that’s the case, the way my markup has to be (inline images), it works perfectly for using the Twitter API and masking the avatars. If somehow I could support IE9+, my problem would be solved.

dfogge

# December 30, 2012 at 7:38 pm

yes, that is indeed what its doing andy. the catch is your background needs to be a solid color and match the color of the mask.

chris, i’m not sure why the codepen demo is not working in IE, but check it out in the original author’s jsfiddle demo: http://jsfiddle.net/rjzaworski/dpetM/3/

looking good to me on ie8, 9 and 10.

i remember when i used it i didnt have any issues with IE, and this was when i was still testing for ie7.

chrisburton

# December 30, 2012 at 7:49 pm

Ah, thanks for saving the day @dfogge.

Andy Howells

# December 30, 2012 at 7:50 pm

@chrisburton – Working fine for me in IE8-10.

@dfogge – cheers for confirming for me, just was trying to wrap my head around what the JavaScript was actually doing.

dfogge

# December 30, 2012 at 7:51 pm

all credit due to RJ Zaworski, but glad to help!

chrisburton

# December 30, 2012 at 8:35 pm

@andy_unleash Yeah, for some reason I had compatibility mode on.