Applying ChromeFrame

ChromeFrame installer window ChromeFrame is an Internet Explorer plugin that essentially “zombifies” the browser: installing a plugin (which does not require an administrator name or password) that replaces IE’s own rendering engine, transforming the browser into “Chrome with an IE face”. In my opinion ChromeFrame remains the best and most complete way of bringing IE 6 – 9 “up to speed” with current web standards. (Popular alternatives take the form of JavaScript “shims” such as Modernizer, requiring far more work).

Indicating that you want Internet Explorer users who visit your site with ChromeFrame already installed to use the Chrome component is easy: it’s just a meta tag in the <head> section of your document:

<meta http-equiv="X-UA-Compatible" content="chrome=1" />

If you want to have ChromeFrame render the page only if the version of IE is 8 or lower, the meta tag becomes:

<meta http-equiv="X-UA-Compatible" content="chrome=IE8" />

Prompting the user to install ChromeFrame is a little trickier, but not difficult. First, you must link to the following script, again in the <head>:

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js">
</script>

Finally, you need to check if ChromeFrame is installed, and if not, prompt the user to do so. You’ll probably want to delay this until IE has presented the page to the best of its ability, so under the script above, write:

<script>
window.onload=function(){
CFInstall.check({ mode:"overlay", destination:"http://www.domain.com" });
// where the user will be sent after installation
} </script>

If you’re using JQuery instead:

<script>
$(document).ready(function() {
CFInstall.check({ mode:"overlay",
destination:"http://www.demosthenes.info" });
})
</script>

The screen that is generated by JavaScript prompting the user to install ChromeFrame has some CSS hooks. If you want to customize the appearance of the window, add the following classes and declarations to your stylesheet:

.chromeFrameOverlayContent { }
.chromeFrameOverlayContent iframe { }
.chromeFrameOverlayCloseBar { }
.chromeFrameOverlayUnderlay { }

If they don't have install privileges (i.e. in a corporate office with an overzealous I.T. team), will this essentially fail?

posted by Tony Downey 7 months ago

Dudley Storey Nope! ChromeFrame has a single-user install that will work without any username or password required. I've updated the article to reflect this, and placed ChromeFrame on this site so you can see how it works in IE.