Browser detection script

13. September 2010 15:07

This javascript will add a global browser object, with properties to match the current browser version.

Note: it does use navigator.userAgent strings for version detection. It should be used for resolving browser UI quirks, not in place of feature testing.

You can output the detection (after it is loaded) to say a div with an id of diagnostics via:

jQuery(function($){
    var bl = $('<dl></dl>');
    for (var x in browser) {
        if (!isNaN(browser[x] || undefined)) {
            bl.append(
                $('<dt></dt>').text(x)
            ).append(
                $('<dd></dd>').text(browser[x])
            );
        }
    };
    $('#diagnostics')    .append('<br /><br />')
                        .append(bl)
                        .append('<br class="clear" /><br />');
});

Browser Detection Script

/*============================================================================
Copyright (c) 2010, Michael J. Ryan  http://tracker1.info/
All rights reserved.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" 
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE 
ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE 
LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR 
CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF 
SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS 
INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN 
CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) 
ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF 
THE POSSIBILITY OF SUCH DAMAGE.
------------------------------------------------------------------------------

Browser matching for various browser.

    browser.ie
    browser.gecko
        browser.firefox
    browser.khtml
        browser.webkit
            browser.chrome
            browser.safari
    browser.opera

recommended:
    use browser.gecko over browser.firefox
    use browser.webkit over browser.chrome or browser.safari

============================================================================*/
(function(b){
    if (!navigator) return;

    //browsermatch method...
    function bm(re) {
        var m = (navigator && navigator.userAgent && navigator.userAgent.match(re));
        return (m && m[1]);
    }

    //setup browser detection
    b.ie = parseFloat(bm(/MSIE (\d+\.\d+)/)) || null;
    b.gecko = parseFloat(bm(/Gecko\/(\d+)/)) || null;
    b.ff = parseFloat(bm(/Firefox\/(\d+\.\d+)/)) || null;
    b.khtml = parseFloat(bm(/\((KHTML)/) && 1) || null;
    b.webkit = parseFloat(bm(/AppleWebKit\/(\d+\.\d+)/));
    b.chrome = parseFloat(b.webkit && bm(/Chrome\/(\d+\.\d+)/)) || null;
    b.safari = parseFloat(b.webkit && bm(/Safari\/(\d+\.\d+)/) && bm(/Version\/(\d+\.\d+)/)) || null;
    b.opera = parseFloat(bm(/Opera\/(\d+\.\d+)/) && bm(/Version\/(\d+\.\d+)/)) || bm(/Opera\/(\d+\.\d+)/) || null;

    //delete empty values
    for (var x in b) {
        if (b[x] === null)
            delete b[x];
    }

    //disable IE matching for older Opera versions.
    if (b.opera && b.ie) delete b.ie;
}(this.browser = this.browser || {}));
Comments are closed

Tracker1

Michael J. Ryan aka Tracker1

My name is Michael J. Ryan and I've been developing web based applications since the mid 90's.

I am an advanced Web UX developer with a near expert knowledge of JavaScript.