jQuery detect IE6 using jQuery.support NOT jQuery.browser

StackOverflow https://stackoverflow.com/questions/1301993

Question

I have found no definite way to detect IE6 using jquery.support instead of jquery.browser which is not supported anymore. Also I need to account for Quirks mode, Ugh!!!

I have seen a couple of posts on Stack but they all refer to jquery.browser and the documentation for jquery.support is a little vague.

Any help on this would be great and thanks in advance.

Was it helpful?

Solution

I think that the authors of jQuery simple don't want developers to check for which browser is running the application/website anymore. Instead they want us to check different browser features and decide on what to do based on that. It doesn't matter if it's IE6, IE8, Firefox or some new browser. As the application developer you should know how the browser support for different features affects the user's ability to work with your application and you should act accordingly.

$.browser depends on browser sniffing using the User Agent strings which may be unreliable, especially since it's very easy for users to spoof the User Agent on their browser, not that I would worry about it for layout purposes - if they changed their User Agent then it's their fault that their IE6 presenting itself as IE7 fails to render the page correctly. ;)

You can either still use $.browser, despite the fact that it's been deprecated or try to code something on your own. Maybe there's a jQuery plugin for that already? I know that last time I had to check for IE6 I used that method...

OTHER TIPS

I have found no definite way to detect IE6 using jquery.support

No, of course not — that's the whole point.

The dogma is that detecting support for particular features, and coding around the lack of them, is a better way of maintaining cross-browser compatibility than trying to keep track of every browser that exists and what it supports.

Whilst you could work backwards from jquery.support to guess what browser is running, and then use different code that relies on a completely different feature, that would be utterly perverse. You'd be taking the already-fragile approach of assuming browser ‘X’ supports feature ‘Y’, and making it even more fragile by adding another layer of unrelated feature sniffing that could pick up the wrong browser.

So the dogma answer is, don't ever detect IE6, or any other particular browser. Use a feature-sniffing solution such as jquery.support to see directly what features you can use, but don't assume that the presence or absence of feature ‘Y’ means you can or can't use a different feature ‘Z’ associated with the same browser ‘X’. Because that will always go wrong given a new or obscure browser/version you haven't met before.

And the dogma answer is, indeed, usually right. However in reality there are some browser bugs that can't be detected by feature-sniffing and need specific workarounds. And of course the one browser this almost always is, is IE6.

It is unclear whether you are in one of those situations as there is no detail in your question, but when you really do need a horrible hack for That One Browser, approximately the best solution is still conditional comments, dropped into JavaScript or HTML.

Brad Koehler has the idea. Use IE conditional statements like those below

<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ --> 
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en" class="no-js"><!--<![endif]-->

Then with javascript and a bit of jQuery you can then do this..

$(document).ready(function () { 
    if ($('html').is('.ie6')) {
       alert('You are running IE6!');
    } else if($('html').is('.ie7')) {
    alert("You are running IE7!");
    } else {
       // Browsers other than IE6 and 7.
    }
});

The editor is cannibalising my first section of code so here's the link to it - http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

I have done something a bit dirty in some testing just now, not wanting to use the deprecated .browser but not having read and understood .support.

I like most, use a conditional stylesheet to style for IE6. I have simply added an id="IE6" to that and then detected the ID with jQuery.

jQuery.fn.exists = function(){return jQuery(this).length>0;}
          if ($('#IE6').exists()) {
           //do something
          }

This seems to work just fine, I tried firing an alert in there and only got it in IE6, I tried validating the page and it passes as HTML5, I am not sure if there is a deeper underlying problem with what I have done but it seems ok so far.

You can do something like:

    var ie6to8 = jQuery.support.leadingWhitespace;
    var ie7to8 = jQuery.support.objectAll;
    if((ie6to8 && !ie7to8) || (!ie6to8 && ie7to8)) { //simulating a XOR
       // is ie6
    }

The documentation tells that jQuery.support.leadingWhitespace is false on IEs 6, 7 and 8. It's also said that objectAll is false on IE's 7 and 8. I assumed that it was true for the other browsers and made a XOR operation on those values. This way it will only be true when leadingWhitespace value is different from objectAll's, which only happens at IE6.

You can see more here: http://docs.jquery.com/Utilities/jQuery.support

UPDATE: As of jQuery 1.3 Browser Sniffing is no long recommended but still can be done the old way (using $.browser.msie and $.browser.version). Look it up here: http://docs.jquery.com/Release:jQuery_1.3

I know this doesn't fit your "requirements", but as far as I know, there isn't a reliable way using feature detection alone.

This is the only reliable that I have found to detect IE6. It's what I use in SimpleModal and it seems to work well:

var ie6 = $.browser.msie && parseInt($.browser.version) === 6 && typeof window['XMLHttpRequest'] !== "object";
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top