I need to detect IE6 in order to work around the lack of position:fixed. I've been using a simple regex:
var isIE6 = /msie|MSIE 6/.test(navigator.userAgent);
This works almost all the time, except for the user whose browser claims to be both IE6 and IE7:
Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1) ; .NET CLR 1.1.4322; .NET CLR 2.0.50727; InfoPath.1; .NET CLR 3.0.04506.30)
Glorious.
I'd love to use jquery.support, but it looks like that doesn't support querying on whether position:fixed is available. So I'm back to detecting IE6.
There are various suggested solutions, such as looking for the existence of maxHeight. But those seem fairly random and scare me - if there are exceptions to the regex above, how can I be sure there are no exceptions to maxHeight?
I'm thinking of using conditional comments - that way at least it'll be IE itself claiming to be IE6, not a hack. Something like:
<!--[if IE 6]>
<SCRIPT> var isIE6 = true; </SCRIPT>
<![endif]-->
Alternatively there's a function that directly tests if position:fixed is available, but that seems a bit heavy.
Any reason my conditional comment approach won't work? Are there better approaches?
Paul Irish wrote an addition to $.support specifically for checking for position: fixed support. I recommend you go this route, using feature-detection rather than browser detection whenever possible.
You just need to include the last function in that addition, this portion:
$.support.positionFixed = (function() { ..... })();
Include this after jQuery, then you can use it in your code, like this:
if(!$.support.positionFixed) {
//handle browsers that don't support it
}