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 likeversion 4.51. It just sends back 4 in that case. Thus, we could alertviewers 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 isversion 3 or greater, OR if the browser name is Microsoft InternetExplorer and the version is 4 or greater, then we will assign thevariable version as 'n3'. Otherwise, it is going to be 'n2.' Then wemove 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.


Related Articles

  • Last Modified and User's Screen Resolution Detection
    An easy and efficient way to write the date a file was last modified.
    We call the function filemtime() that returns an integer (the number of seconds elapsed from Jan 1st, 1970 00:00 GMT) Anyway, to make this integer viewable by human beings, we just format it using date() function.
  • JavaScript Confirmation Boxes
    A javascript confirmation box can be a handy way to give your visitors a choice of whether or not an action is performed. A confirmation box will pop up much like an alert box, but will allow the viewer to press an OK or Cancel button.
  • JavaScript Redirection
    Redirection is often used to take viewers to a page depending on their browsers name or version. To redirect a viewer instantly, you just need to add a short command in your head section:
  • The Basics- JavaScript Tutorial
    To get started with JavaScript, you will want to be able to see the tag that will set a script apart from the HTML. The tags used to begin and end a script are the tags. The opening tag should appear like this
  • 4 Powerful Features of Javascript Programming Language
    In the community of web developers and surfers, Javascript is highly popular as client side scripting language for web browsers. Lets take a look at some of the features of this language.
  • Statusbar Message
    This is a quick, and quite simple tutorial. Now its not html, it uses Javascript. What it does is lets you customize what it says in the status bar usually at the bottom left of your browser. Right now in your browser it should say Infinite Designs.org ..... Heres how to make it do that...
  • Form Validation
    Learn the different ways of validating your form with Javascript.
  • Beginner JS Pt. 1
    This tutorial is a well laid out recipe for basic Javascript. The article is brief and is limited to three topics: Calling the Script, Writing Comments, and Doing Stuff (Basic). Illustrations make it easy.
  • JavaScript Prompts
    Well, lets say you wanted to get somebodys name before they saw the page, and then write their name on your page right before their very eyes... Well, you can do this using a javascript prompt. Heres the command:
  • JavaScript Alerts
    Well, you want to add one of those JavaScript alert boxes that come out of nowhere, dont you? Okay, lets begin with the alert box that just tells the viewer something you want them to know. Heres the alert command:

Contact Web Design Outsource and get started today

Need Website Designing, Development, Redesigning, Maintenance and SEO services or help growing your company's web presence? Request a free Quote Now.