Hey all...

I've been experimenting with jQuery a lot, and really like the
functionality it provides.  However, there are times when I'd like to
use jQuery, but need to provide an alternative site for people with
older browsers (particularly visitors from rural locations in
developing countries, who often have much older and slower
technology).

So, I need to detect the browser and make sure it can support jQuery.
Here is the basic code I've developed, which I've tested in a handful
of browsers.

// object detection for jQuery-supported browsers
var isIE = (document.compatMode && document.all); // IE 6+
var isFF = (Array.every || window.Iterator); // FF 1.5+
var isOther = (typeof document.documentElement.style.maxHeight !=
"undefined") && (!document.all); // Safari, Opera...
var jQ = false;

// act on browser type
if (!isIE && !isFF && !isOther) {
        window.location.replace("index2.html");
} else {
        jQ = true;
        document.write('<script language="javascript" src="jquery.js"><\/
script>');
        document.write('<script language="javascript" src="extras.js"><\/
script>');
}

You can test this at http://www.tordevries.com/browser-check/.  The
code uses object detection to identify browsers, though I'm not sure
this is the most optimal way of doing it.  If none of the detection
booleans is true, the user is booted to a backup page (index2.html);
otherwise, the script dynamically loads jQuery and an external
JavaScript file.  (I use a meta-refresh tag in the <noscript> tag to
forward people who have disabled JavaScript.)

Oddly, if you use $(document).ready in the dynamically-loaded
extras.js file, Safari won't load it.  I can't figure out why.  Other
browsers are fine.  So I fall back to an onLoad trigger in the body
tag, referencing a function in the extras.js file.  Unfortunately,
older browsers (like IE 5 on the Mac) may trigger onLoad before they
get forwarded to the secondary page, thus generating an error because
the function hasn't been loaded.  Thus, the body tag actually looks
like this:

<body onLoad="if (jQ) init();">

If jQ is true, then onLoad can safely fire the init() function.
Otherwise it's ignored.

So... thoughts? comments?  Does the test page work for you?  Is there
a better way to do this?  Thanks in advance.



-tdv

Reply via email to