Browser check

23-11-2010 1:34pm #1

I wonder if people could help me with this - I would like to do some HTML5 in a website, however I am aware that some users may not have the up-to-date browsers that are required.

I have found code in Javascript to determine what browser you are using and the version:

<html>
<body>

<script type="text/javascript">

document.write("Browser Name: " + navigator.appName);
document.write("<br /><br />");
document.write("Browser Version: " + navigator.appVersion);

alert("You are using " + navigator.appName + " as a browser and the version is " + navigator.appVersion);

</script>

</body>
</html>

Is it possible to then do a check on their browser version (using navigator.appVersion, I would presume) against the versions required? Do browsers have specific codes that you can use?

BopNiblets · 26-11-2010 12:52am

I think the user agent has the version: http://www.w3schools.com/js/js_browser.asp
Looks like you're using w3schools site too (good site), it's the user agent that gives me the version of Firefox, appVersion says my appVersion is 5.0, dunno what that's referring to but I'm on Firefox 3.6.12 which is in the userAgent part.

26-11-2010 1:01am

I love w3schools. Such an amazing resource to use. I only discovered recently that when Netscape was first released, its codename was Mozilla, and when you run that code using Mozilla Firefox, Netscape comes up.

tomED · 26-11-2010 9:24pm

It'll be a little while before everyone on the web will be capable of viewing HTML5 websites.

Why not design your pages so that they will render things based on the capabilities of the browser. You could use something like http://www.modernizr.com/ which is a Javascript API that allows you to check whether key features of HTML 5 are possible from the users browser and you can degrade gradefully.

Just my two cents...

26-11-2010 9:30pm

If I'm honest, I'm only thinking of using HTML5 because it will be for a college project and they are looking for the "wow" factor. I aim to have one or two pages designed using normal HTML and HTML5, hence the browser check, because the website itself will primarily be aimed towards women who are between 35-40, if our questionnaires are anything to go by.

tomED · 27-11-2010 3:46pm

Deleted User wrote: »

I aim to have one or two pages designed using normal HTML and HTML5, hence the browser check,

Did you look at that link I sent you?

The whole idea of it is to have ONE page, and you display whatever code you need for the respective browser.

To be honest, I don't know why you think HTML5 will give your project the "wow factor". HTML5 is really only giving the "wow" factor to people who have developed websites before. It doesn't offer anything to the general website visitor.

You can still do pretty much everything HTML5 can do from a visual aspect.

29-11-2010 8:47pm

I understand your point and if it weren't for the fact that the website would be graded, I'd agree with you. I'd be more using HTML5 to impress the lecturers and not the people who would be using it, which would mostly be women in the 35-40 range

tomED · 30-11-2010 10:30am

Deleted User wrote: »

I understand your point and if it weren't for the fact that the website would be graded, I'd agree with you. I'd be more using HTML5 to impress the lecturers and not the people who would be using it, which would mostly be women in the 35-40 range

Ok, so the lecturers should be more impressed at the fact that you've taken into account the fact that your highly sophisticated website has taken older browsers into account.

If they don't.... they shouldn't really be teaching!!

02-12-2010 2:25pm

I'm now experimenting with some code but having problems with Mozilla Firefox and Internet Explorer. This code works with Chrome great. This is the code I'm trying out

<html>
<body>

<script type="text/javascript">

//document.write("Browser Name: " + navigator.appName);
//document.write("<br /><br />");
//document.write("Browser Version: " + navigator.appVersion);


if(navigator.appName == "Netscape" && navigator.appVersion == "5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.7 (KHTML, like Gecko) Chrome/7.0.517.44 

Safari/534.7")
{
document.write("You are using the latest version of Google Chrome and this works!");
alert("You are using Google Chrome and it is the latest version");
}

if(navigator.appVersion == "Netscape" && navigator.appVersion == "5.0 (Windows; en-US)")
{
document.write("You are using the newest version of Mozilla Firefox. This hopefully works!");
alert("You are using Mozilla Firefox and it is the latest version");
}

if(navigator.appName == "Microsoft Internet Explorer")
{
document.write("You are using Internet Explorer");
alert("You are using Internet Explorer");
}

</script>

</body>
</html>

As I've said, the alert pops up when it is Chrome, but not with Mozilla Firefox. I'm using the appVersion and copying the whole thing, because it seems both Mozilla and Chrome have the same appVersion, which is Netscape.

Duh! I just realised that I had navigator.appVersion instead of appName for Firefox.

Well this is just embarrassing. Right now what I'm attempting to do is have a button that the clicks to check their browser type/version. Yet for some reason I cannot get the button to appear on screen

This is the code I'm working on now:

<html>
<head>
<title>Click here</title>
<script type = "text/javascript">
function browserCheck()
//Start of Function
{
if(navigator.appName == "Netscape" && navigator.appVersion == "5.0 (Windows; U; 

Windows NT 6.1; en-US) AppleWebKit/534.7 (KHTML, like Gecko) Chrome/7.0.517.44 

Safari/534.7")
//Start of If statement
{
document.write("You are using the latest version of Google Chrome and this 

works!");
alert("You are using Google Chrome and it is the latest version");
//End of If statement
}

//End of Function
}
</head>
<body>
<form>
<input type=button name="button" value="Click Me" onClick="browserCheck()">
</form>
</body>
</html>

Another Duh! moment! I never closed the script!

Browser check

Comments