Tutorial: Detect browsers with jQuery

Detect browsers with jQuery

If you want to detect browsers with jQuery it is really easy to manage with it.

Although it isn't relly accessible for users with disabled JavaScript.













/* ===== Firefox ===== */

// Select Firefox
if (jQuery.browser.mozilla) {
// do sth.
}

// Select Firefox 1.5.x to 2.x
if (jQuery.browser.mozilla && jQuery.browser.version.substr(0, 3) == '1.8') {
// do sth.
}

// Select Firefox under 3.x
if (jQuery.browser.mozilla && jQuery.browser.version < '1.9') {
// do sth.
}

// Select Firefox 3.0.x and above
if (jQuery.browser.mozilla && jQuery.browser.version.substr(0, 3) == '1.9') {
// do sth.
}

// Select just Firefox 2.0.x
if (jQuery.browser.mozilla && jQuery.browser.version == '1.8.1') {
// do sth.
}

// Select just Firefox 3.0.x
if (jQuery.browser.mozilla && jQuery.browser.version == '1.9') {
// do sth.
}

// Select just Firefox 3.5.x
if (jQuery.browser.mozilla && jQuery.browser.version == '1.9.1') {
// do sth.
}

// Select just Firefox 3.6.x
if (jQuery.browser.mozilla && jQuery.browser.version == '1.9.2') {
// do sth.
}

// Select just Firefox 7.x
if (jQuery.browser.mozilla && jQuery.browser.version.substr(0, 1) == '7') {
// do sth.
}

// Select just Firefox 14.x
if (jQuery.browser.mozilla && jQuery.browser.version.substr(0, 2) == '14') {
// do sth.
}


/* ===== Internet Explorer ===== */

// Select Internet Explorer
if (jQuery.browser.msie) {
// do sth.
}

// Select Internet Explorer above 6
if (jQuery.browser.msie && jQuery.browser.version > 6) {
// do sth.
}

// Select Internet Explorer 7 and below
if (jQuery.browser.msie && jQuery.browser.version <= 7) {
// do sth.
}

// Select just Internet Explorer 6
if (jQuery.browser.msie && jQuery.browser.version == '6.0') {
// do sth.
}

// Select just Internet Explorer 7
if (jQuery.browser.msie && jQuery.browser.version == '7.0') {
// do sth.
}

// Select just Internet Explorer 8
if (jQuery.browser.msie && jQuery.browser.version == '8.0') {
// do sth.
}

// Select just Internet Explorer 9
if (jQuery.browser.msie && jQuery.browser.version == '9.0') {
// do sth.
}


/* ===== Safari / Chrome ===== */

// Select Safari / Chrome
if (jQuery.browser.safari) {
// do sth.
}

// Select Safari 3
if (jQuery.browser.safari && (navigator.appVersion.indexOf('3.') != -1)) {
// do sth.
}

// Select Safari 4
if (jQuery.browser.safari && (navigator.appVersion.indexOf('4.') != -1)) {
// do sth.
}

// Select Chrome 1
if (jQuery.browser.safari && (navigator.appVersion.indexOf('1.') != -1)) {
// do sth.
}

// Select Chrome 3
if (jQuery.browser.safari && (navigator.appVersion.indexOf('3.') != -1)) {
// do sth.
}

// Select Chrome 13
if (jQuery.browser.safari && (navigator.appVersion.indexOf('13.') != -1)) {
// do sth.
}

// Select Chrome 16
if (jQuery.browser.safari && (navigator.appVersion.indexOf('16.') != -1)) {
// do sth.
}


/* ===== Opera ===== */

// Select Opera
if (jQuery.browser.opera) {
// do sth.
}

// Select Opera 9.5 and above
if (jQuery.browser.opera && jQuery.browser.version >= '9.5') {
// do sth.
}

// Select just Opera 9.5
if (jQuery.browser.opera && jQuery.browser.version == '9.5') {
// do sth.
}

// Select just Opera 10
// Note: Opera 10's user agent looks like Opera/9.80 [...] Version/10.00
if (jQuery.browser.opera && jQuery.browser.version == '9.8') {
// do sth.
}
With the release of jQuery 1.8 the $.browser variable will be deprecated and in version 1.9 it will be removed.

Note: If I have forgotten some browsers let me know it!


Note²: Instead of browser user agent sniffing a good alternative is to use feature detection e.g. via Modernizr.