Posts Tagged ‘IE’

Take a stand against IE!

Posted in 'General' by James on July 12th, 2009
Take a stand against IE!

I’ve got a great idea; let’s annoy the hell out of 75% of IE6 users by showing them a “you should upgrade” message, even though none of them have the actual capability to upgrade! Seriously, what a superb idea! It’s like having a “fly to work” sign instead of a train station, when everyone knows that only 25% of humans can actually fly!

Yes, a recent survey by Digg revealed that only one quarter of all IE6 users have the power to change. This minority is made up of two groups: those that simply don’t see a need to upgrade and those that prefer IE6 to other browsers.

So, without sounding too pessimistic, trying to get IE6 users to upgrade is almost entirely pointless! Your efforts would be better spent teaching 75% of humankind how to fly!

I haven’t really got a good idea; in fact, I’m equally as clueless as most of you… How on earth are we going to solve the IE problem, or, rather the “Microsoft” problem?

Have you ever read about that world record that was set when a bunch of people somewhere jumped up at exactly the same time? Speculation has it that the earth was temporarily knocked off its axis, which, consequently saved the earth from a massive meteor strike!? Well I haven’t, but I do have a similar idea that is almost guaranteed to work.

Imagine, if every single website on earth suddenly broke in IE – users of IE would be utterly confused and annoyed – there would be an epic stream of complaints battering every IT department this side of the sun! Eventually it would result in the demise of IE (all versions). So you see, it is possible! Together we can bring down IE, it just takes a tad of collaboration!

“Grayscaling” in non-IE browsers

Posted in 'CSS, JavaScript' by James on May 11th, 2009
“Grayscaling” in non-IE browsers

This started out as a little experiment and eventually turned into quite an endeavor. The task was simple enough; to emulate Internet Explorer’s ‘grayscale‘ filter in all non-IE browsers. The solution, much to my initial surprise, is not as tricky as you would think.

The ‘grayscale‘ filter in IE can be applied to any element and visually transforms the element itself into grayscale. You can apply the filter using one line of messy proprietary CSS:

elem.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)';

This can also be defined in your StyleSheet:

elem {
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    /* Element must "hasLayout"! */
    zoom: 1;
}

As shown, getting this to work in IE is a piece of cake; other browsers, however, require much more attention!

There are two things to consider; images and everything else. “Everything else” is quite simple; loop through all elements within the document and look for colour properties such as ‘backgroundColor’ and ‘color’, then convert their RGB values to grayscale. There are a few ways of doing this; note that we’re not talking about desaturating a photo; “grayscaling” is slightly different (as I understand it):