Detect Unsupported Browser Version And Show Specific Div With Message
I have a chat bot in my website it need latest version of browsers to work perfectly so I need to show a message to user saying 'Please update your browser to latest version'. I do
Solution 1:
navigator.sayswho = ( function () {
var ua = navigator.userAgent, tem,
M = ua.match( /(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i ) || [];
if ( /trident/i.test( M[1] ) ) {
tem = /\brv[ :]+(\d+)/g.exec( ua ) || [];
return'IE ' + ( tem[1] || '' );
}
if ( M[1] === 'Chrome' ) {
tem = ua.match( /\b(OPR|Edge)\/(\d+)/ );
if ( tem != null ) return tem.slice( 1 ).join( ' ' ).replace( 'OPR', 'Opera' );
}
M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
if ( ( tem = ua.match( /version\/(\d+)/i ) ) != null ) M.splice( 1, 1, tem[1] );
return M.join( ' ' );
} )();
//document.getElementById('printVer').innerHTML=navigator.sayswhovar str = navigator.sayswho;
var browser = str.substring( 0, str.indexOf( " " ) );
var version = str.substring( str.indexOf( " " ) );
version = version.trim();
version = parseInt( version );
console.log( browser );
console.log( version );
if ( ( browser == "Chrome" && version < 70 ) || ( browser == "Firefox" && version < 53 ) || ( browser == "Safari" && version < 5 ) || ( browser == "IE" && version < 11 ) || ( browser == "Opera" && version < 52 ) ) {
$( '#printVer' ).show();
}
else {
$( '#printVer' ).hide();
}
Solution 2:
If you want to determine if it's anything other than support browsers, you might want to use jQuery's browser detection, something like:
<scripttype="text/javascript">// check if browser is IE6 (when IE) or not FF6 (when FF)if (($.browser.msie && $.browser.version.substr(0,1) == '6')
|| ($.browser.mozilla && $.browser.version.substr(0,1) != '3')) {
$('#browserWarning').show();
}
</script>
Solution 3:
Here I'm not checking OS e.g. mobile or bla bla. Try this for Browser version ==>
( function (window) {
//Get Browser Typevar browser = {
/** Define Browser Type*/type:/** Whether we are using a IE Browser or not. */typeof ( window.attachEvent ) === 'function' && !( Object.prototype.toString.call( window.opera ) == '[object Opera]' )
? 'IE'/** Whether we are using a Opera Browser or not. */
: ( Object.prototype.toString.call( window.opera ) == '[object Opera]' || navigator.userAgent.indexOf( 'Opera Mini' ) > -1 )
? 'Opera'/** Whether we are using a WebKit Type Browser or not. */
: ( navigator.userAgent.indexOf( 'AppleWebKit/' ) > -1 )
? 'WebKit'/** Whether we are using a Gecko Type Browser or not. */
: ( navigator.userAgent.indexOf( 'Gecko' ) > -1 && navigator.userAgent.indexOf( 'KHTML' ) === -1 )
? 'Gecko'/** Whether we are using a Apple Browser or not. */
: ( /Apple.*Mobile/.test( navigator.userAgent ) )
? 'MobileSafari'
: undefined
};
//Get Browser Version
browser.version = function () {
let ua; ua = navigator.userAgent;
returnthis.type === 'Gecko' ? /** Whether this browser type is Gecko*/function ( a ) {
let rv = -1, re = newRegExp( "rv:([0-9]{1,}[\.0-9]{0,})" );
re.exec( ua ) !== null ? rv = parseFloat( RegExp.$1 ) : '';
if ( ua.indexOf( 'Firefox/' ) > 0 ) { a.name = 'Firefox'; return rv; }
if ( ua.indexOf( 'Trident/' ) > 0 ) {/** IE > 10*/a.name = 'IE'; return rv; }
return rv;
}( this ) : this.type === 'WebKit' ?/** Whether this browser type is WebKit*/function ( a, b ) {
let rv = -1, re;
re = ua.match( /Opera|OPR\/([0-9]+)\./ );
if ( null !== re ) {
rv = parseInt( re[1], 10 ); a.name = 'Opera';
return rv;
}
re = ua.match( /Chrom(e|ium)\/([0-9]+)\./ );
if ( null !== re ) {
rv = parseInt( re[2], 10 ); a.name = 'Chrome';
return rv;
}
re = /AppleWebKit\/([\d.]+)/.exec( navigator.userAgent );
if ( null !== re ) {
rv = parseFloat( re[1] ); a.name = 'Safari';
return rv;
}
return rv;
}( this ) : this.type === 'IE' ?/** Whether this browser type is IE (IE version < 9)*/function ( a ) {
let rv = -1, re;
re = newRegExp( "MSIE ([0-9]{1,}[\.0-9]{0,})" );
return re.exec( ua ) !== null ? ( rv = parseFloat( RegExp.$1 ), a.name = 'IE', rv ) : rv;
}( this ) : this.type === 'Opera' ?/** Whether this browser type is Opera*/function ( a ) {
let rv = -1;
try {
rv = navigator.userAgent.match( /Version\/([1-9]+\.[0-9]{2})/ )[1]; a.name = 'Opera';
return rv;
} catch ( ex ) {
return rv;
}
}( this ) : /** Undefined browser type define*/ -1;
}.call( browser );
window.browser = browser;
}( window ) );
Check your condition ==>
if ( ( browser.name === 'Chrome' && browser.version <= 60 )
|| ( browser.name === 'IE' && browser.version < 11 )
|| ( browser.name === 'Firefox' && browser.version <= 50 ) ) {
// Not Supported
} else {
//Supported or Undefined Browser
}
Post a Comment for "Detect Unsupported Browser Version And Show Specific Div With Message"