Detect Internet Explorer 6 (IE6) and other popular browsers with Mootools

One of the top keyword searches on this blog is ‘detect ie6 mootools‘; As popular as this search term is, it’s not actually covered, so this post should fill that gap!

Mootools is a great, stable, open source javascript library which is maintained by a limited number of proffesional developers. It does have a browser detection class built in but it doesn’t natively provide a method to detect the version of Internet Explorer.

The Mootools developers are code purists; Extending their browser class would be easy but they do not want to do it. They do provide a method to get the browser build and this could be used along with the remaining browser string to work out the version. Essentially, they like to keep their code relevant and streamlined.

In a previous post i covered how to detect IE6 with one line of Javascript. This solves the problem where later builds of IE6 can show a browser string similar to IE7.

This can be combined with the Mootools browser class to produce browser variables.

//declare global variables
var WEBKIT = Browser.Engine.webkit;
var GECKO = Browser.Engine.gecko;
var OPERA = Browser.Engine.presto;
var IE = Browser.Engine.trident;
var IE6 = (navigator.userAgent.toLowerCase().indexOf('msie 6') != -1)
&& (navigator.userAgent.toLowerCase().indexOf('msie 7') == -1);

//test variables (delete)
if(WEBKIT) alert("WEBKIT");
if(GECKO) alert("GECKO");
if(OPERA) alert("OPERA");
if(IE) alert("IE");
if(IE6) alert("IE6");

Placing this code at the top of your JavaScript include will give you simple global boolean variables for each browser platform. Creating one variable per browser at the very start means the calls to the browser class are limited to one and the detection script is ran only once. It also means you have very simple and easy to remember variables to use throughout your code.

Please leave a comment