Getting Browser Information using JQuery

One day every browser will act in same way and support same web standards. However, that’s not today. In a sufficiently complicated web application, it’s important to know which browser user is using so we can know which JavaScript functions are available and which CSS properties it supports. Here, I am showing how you know about the users browser using JQuery. We can find lot of information about users browser like its name, version number etc through jQuery.

At the highest level, JQuery offers an object called browser that contains some simple flags to determine which one of the major browsers is currently being used – Safari, Opera, IE, or Mozilla.

   $(document).ready(function(){
 
    var browser;
    if($.browser.mozilla)
      browser = "Firefox";
    else if($.msie)
      browser = "Internet Explorer";
    else if($.browser.opera)
      browser = "Opera";
    else if($.browser.safari)
      browser = "Safari";
    else
      browser = "Unknown";
 
    $('#browserName').append(browser);
  });

Create a DIV so in your page so you can see the output of this JavaScript.

 <div id="browserName">Your Browser: </div>

When you execute the code, the output should look something like below. If you are using Safari.

Your Browser: Safari

,


  1. #1 by Sanooj ah - September 2nd, 2011 at 15:52

    like this way we can use hacks for browser
    $(document).ready(function()
    {
    if ( $.browser.msie ){
    if($.browser.version == ’6.0′)
    { $(‘html’).addClass(‘ie6′);
    }
    else if($.browser.version == ’7.0′)
    { $(‘html’).addClass(‘ie7′);
    }
    else if($.browser.version == ’8.0′)
    { $(‘html’).addClass(‘ie8′);
    }
    else if($.browser.version == ’9.0′)
    { $(‘html’).addClass(‘ie9′);
    }
    }
    else if ( $.browser.webkit )
    { $(‘html’).addClass(‘webkit’);
    }
    else if ( $.browser.mozilla )
    { $(‘html’).addClass(‘mozilla’);
    }
    else if ( $.browser.opera )
    { $(‘html’).addClass(‘opera’);
    }
    });

    if want to add hack for opera add like
    .opera .class
    { property : value ;
    }

(will not be published)

 


Submit Comment
Subscribe to comments feed
  1. No trackbacks yet.