Open Directory Site JavaScript Tutorials

ASP | XML | VBScript | JavaScript | ADO | CSS | XMLDOM | PHP | Operating Systems

Home >> JavaScript >>  JavaScript Browser Detection

 JavaScript Browser Detection

 

Example

1. How to detect the client's browser

Coding

<html>

<head>

<script language="JavaScript">

document.write("You are browsing this site with: "+ navigator.appName)

</script>

</head>

<body>

</body>

</html>

Output

You are browsing this site with: Microsoft Internet Explorer

2. How to detect more details about the client

Coding

<html>

<body>

<script language="JavaScript">

document.write("BROWSER: ")

document.write(navigator.appName + "<br>")

document.write("BROWSERVERSION: ")

document.write(navigator.appVersion + "<br>")

document.write("CODE: ")

document.write(navigator.appCodeName + "<br>")

document.write("PLATFORM: ")

document.write(navigator.platform + "<br>")

document.write("REFERRER: ")

document.write(document.referrer + "<br>")

</script>

</body>

</html>

Output

BROWSER: Microsoft Internet Explorer

BROWSERVERSION: 4.0 (compatible; MSIE 5.0; Windows NT; DigExt)

CODE: Mozilla

PLATFORM: Win32

REFERRER: http://www.w3schools.com/js/tryit.asp?filename=tryjs_browserdetails

3.How to detect details about the client's monitor

Coding

<html>

<body>

<script language="JavaScript">

document.write("SCREEN RESOLUTION: ")

document.write(screen.width + "*")

document.write(screen.height + "<br>")

document.write("AVAILABLE VIEW AREA: ")

document.write(window.screen.availWidth + "*")

document.write(window.screen.availHeight + "<br>")

document.write("COLOR DEPTH: ")

document.write(window.screen.colorDepth + "<br>")

</script>

</body>

</html>

Output

SCREEN RESOLUTION: 800*600

AVAILABLE VIEW AREA: 800*572

COLOR DEPTH: 8

4.How to redirect the user to different pages, depending on browser

Coding

<html>

<head>

<script language="JavaScript">

function redirectme()

{

bname=navigator.appName

if (bname.indexOf("Netscape")!=-1)

{

window.location="tryjs_netscape.htm"

return

}

if (bname.indexOf("Microsoft")!=-1)

{

window.location="tryjs_microsoft.htm"

return

}

window.location="tryjs_other.htm"

}

</script>

</head>

<body>

<form>

<input type="button" onclick="redirectme()" value="Redirect">

</form>

</body>

</html>

5.How to write a different message to the user, depending on the browser

Coding

<html>

<head>

<title>Cross browser detect</title>

<script language="JavaScript">

function browserversion()

{

bversion="0"

if (navigator.appVersion.indexOf("2.0")!=-1)

{

bversion="2"

}

if (navigator.appVersion.indexOf("3.0")!=-1)

{

bversion="3"

}

if (navigator.appVersion.indexOf("4.0")!=-1)

{

bversion="4"

}

if (bversion=="2")

{

document.forms[0].browser.value="Wake up! Your 2.0 browser is from the stone-age"

}

if (bversion=="3")

{

document.forms[0].browser.value="You should update your 3.0 browser."

}

if (bversion=="4")

{

document.forms[0].browser.value="You are browsing with a 4.0 browser"

}

}

</script>

</head>

<body onload="browserversion()">

<form>

<input type="text" name="browser" size="50">

</form>

</body>

</html>

Output

You are browsing with a 4.0 browser

Cheap Web Hosting Articles - Web Site Design & Web Hosting Tutorials - Domain Hosting