CODEWITHSUNDEEP
javascripthtml
user1006177
user1006177

Reputation: 1

How to alert a user their browser is not the latest version?

I found a .NET version of this, but can't find a javascript/jquery way to do this. I test my site in the latest IE/Chrome/FF/Safari/Opera. That is a difficult enough task (to me) without adding backward compatibility. The message will be to simply use another browser which is up to date. Are there any scripts that do this? I'm hoping to find a resource that tracks this sort of thing so I don't have to.

Upvotes: 0

Views: 768

Answers (3)

Oracle
Oracle

Reputation: 318

You could navigator.appVersion to find the versions and filter the relevant version using navigator.appName which can give you a version number you can compare against a minimum required version that you could set.

Using somthing like this (JSFiddel) you could break down the string and get the version.

var objappVersion = navigator.appVersion;
var objAgent = navigator.userAgent;
var objbrowserName = navigator.appName;
var objfullVersion = '' + parseFloat(navigator.appVersion);
var objBrMajorVersion = parseInt(navigator.appVersion, 10);
var objOffsetName, objOffsetVersion, ix;
if ((objOffsetVersion = objAgent.indexOf("Chrome")) != -1) {
    objbrowserName = "Chrome";
    objfullVersion = objAgent.substring(objOffsetVersion + 7);
}
else if ((objOffsetVersion = objAgent.indexOf("MSIE")) != -1) {
    objbrowserName = "Microsoft Internet Explorer";
    objfullVersion = objAgent.substring(objOffsetVersion + 5);
} // In Firefox
else if ((objOffsetVersion = objAgent.indexOf("Firefox")) != -1) {
    objbrowserName = "Firefox";
}
else if ((objOffsetVersion = objAgent.indexOf("Safari")) != -1) {
    objbrowserName = "Safari";
    objfullVersion = objAgent.substring(objOffsetVersion + 7);
    if ((objOffsetVersion = objAgent.indexOf("Version")) != -1) objfullVersion = objAgent.substring(objOffsetVersion + 8);
} // For other browser "name/version" is at the end of userAgent
else if ((objOffsetName = objAgent.lastIndexOf(' ') + 1) < (objOffsetVersion = objAgent.lastIndexOf('/'))) {
    objbrowserName = objAgent.substring(objOffsetName, objOffsetVersion);
    objfullVersion = objAgent.substring(objOffsetVersion + 1);
    if (objbrowserName.toLowerCase() == objbrowserName.toUpperCase()) {
        objbrowserName = navigator.appName;
    }
}
if ((ix = objfullVersion.indexOf(";")) != -1) objfullVersion = objfullVersion.substring(0, ix);
if ((ix = objfullVersion.indexOf(" ")) != -1) objfullVersion = objfullVersion.substring(0, ix);
objBrMajorVersion = parseInt('' + objfullVersion, 10);
if (isNaN(objBrMajorVersion)) {
    objfullVersion = '' + parseFloat(navigator.appVersion);
    objBrMajorVersion = parseInt(navigator.appVersion, 10);
}

Example code from here.

However it would probably be more beneficial to check for compatibility using the individual features that may lack support and inform the user of any incompatibility's and explain any ramifications.

Upvotes: 1

Marius George
Marius George

Reputation: 526

One solution is to have a warning message in a div, and this div is hidden in a subsequent media query section. Only browsers supporting CSS 3 media queries will then auto hide this warning message div.

Upvotes: 0

Itay Grudev
Itay Grudev

Reputation: 7424

Check what these guys did: Browser Update Initiative. You can integrate it easily and they offer code samples: http://browser-update.org/

It is going to be much harder to implement on your own and you will have to regularly update your browser version data.

Upvotes: 1

Related Questions