javascript Browser Detection

JavaScript Browser DetectionBrowser detection allows you to find out what browser your viewer is using, and then perform a script based on it-- or just to send a friendly message to those with your favorite browser.

There are two objects often used for this, the navigator.appName and navigator.appVersion objects. The first one returns the name of the browser, the second returns the version of the browser.

If the browser is Netscape, navigator.appName returns the string "Netscape". If it is Internet Explorer, it returns the string "Microsoft Internet Explorer". Using just this, you could make a script to alert people as to what browser they are using (just to bug them). Like this:

<HEAD>
<SCRIPT language="JavaScript">
<!--
var browserName=navigator.appName;
if (browserName=="Netscape")
{
alert("Hi Netscape User!");
}
else
{
if (browserName=="Microsoft Internet Explorer")
{
alert("Hi, Explorer User!");
}
else
{
alert("What ARE you browsing with here?");
}
}
//-->
</SCRIPT>
</HEAD>

You can do the same thing with the navigator.appVersion, except you will most likely want to grab just the integer from the version information (2,3,4, etc.). To do this, we use the parseInt() function:

var browserVer=parseInt(navigator.appVersion);

Now, it returns only the integer value and not something like version 4.51. It just sends back 4 in that case. Thus, we could alert viewers as to whether their browser is new enough for us or not:

<HEAD> <SCRIPT language="JavaScript"> <!-- var browserVer=parseInt(navigator.appVersion); if (browserVer >= 4) { alert("Your browser is new enough for my site."); } else { alert("I think you need a new browser!"); } //--> </SCRIPT> </HEAD>

Of course, you can use both objects to be more exact. You could look for a certain set of browsers and only if they are above a certain version:

<HEAD>
<SCRIPT language="JavaScript">
<!--
var browserName=navigator.appName;
var browserVer=parseInt(navigator.appVersion);
if ((browserName=="Netscape" && browserVer>=3) || (browserName=="Microsoft Internet Explorer" && browserVer>=4))
version="n3";
else
version="n2";

if (version=="n3")
alert("Your browser passes the test");
else
alert("You need an upgrade, I think.");
//-->
</SCRIPT>
</HEAD>

As you can see, that uses a lot of the logical operators from a previous section. It is basically saying that "if the browser name is Netscape and it is version 3 or greater, OR if the browser name is Microsoft Internet Explorer and the version is 4 or greater, then we will assign the variable version as 'n3'. Otherwise, it is going to be 'n2.' Then we move on to the rest."

One of the more common uses for browser detection is to redirect a viewer to a page made for his/her browser type or browser version. We will discuss that in the next section on redirection.

Well, that does it for now. Let's go check out the next section, Redirection with JavaScript.


Close    To Top
  • Prev Article-Web Design:
  • Next Article-Web Design:
  • Now: Tutorial for Web and Software Design > Web Design > JavaScript > Web Design Content
    Photoshop Tutorial
     

    Special Effect

      3D Effect
      Photoshop Articles
    Programming Tutorial
     

    C/C++ Tutorial

      Visual Basic
      C# Tutorial
    Database Tutorial
     

    MySQL Tutorial

      MS SQL Tutorial
      Oracle Tutorial
    Geek Tutorial
     

    Blogging Tutorial

      RSS Tutorial
      Podcasting Tutorial
    Graphic Design Tutorial
      Coreldraw Tutorial
      Illustrator Tutorial
      3D Tutorials
    Webmaster Articles
     

    Domain Service

      Web Hosting
      Site Promotion
    Java Tutorial/ Articles
     

    Java Servlets

      JavaEE Tutorial
     

    JavaBeans Tutorial

    XML Tutorial/ Articles
     

    XML Style

      AJAX Tutorial
      XML Mobile
    Flash Tutorial/ Articles
     

    Flash Video

      Action Script
      Flash Articles
    OS Tutorial/ Articles
      Linux Tutorial
      Symbian Tutorial
      MacOS Tutorial
    Personal Tech
      Hardware Tutorial
      Software Tutorial
      Online Auction