how to differentiate between standard and quirks document mode for IE10 - javascript

I have to check when a user has selected Quirks or Standard document mode from the developer tool for IE10. Using the below code, i always get the same value i.e. 10 for both the modes.
document.documentMode
Please let me know how could i discriminate between the two document modes in IE10. I am using javascript for the same.

I used the below code and every thing worked fine. This is working on all the IE versions (Tested and Verified :) ).
//Checks the document mode of the IE and displays an error if the doc mode is not supported
function CheckDocMode() {
//Get the browser name
var browserName = navigator.appName;
//Do not display the Div containing the error message
document.getElementById('DocModeError').style.display = 'none';
//Check if the browser is IE
if (browserName == "Microsoft Internet Explorer") {
//Get the IE version, document mode and complatibility mode
var IEVersion = GetIEVersion();
var IEDocMode = document.documentMode;
var IECompatibilityMode = document.compatMode;
//Confirm that the browser is IE8/9/10
if (IEDocMode != undefined) {
//Do not display the error message if the IE=10 and Doc Mode = Standard
if ((IEVersion == 10 || IEVersion == 9 || IEVersion == 8 || IEVersion == 7)
&& (IEDocMode == 10 && IECompatibilityMode == "CSS1Compat")) {
return;
}
//Display the error if the document mode is anything other than IE8 and IE9
if (IEDocMode != 8 && IEDocMode != 9) {
document.getElementById('DocModeError').style.display = 'block';
}
}
}
}
function GetIEVersion() {
var myNav = navigator.userAgent.toLowerCase();
return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;
}

Related

Detecting user language in IE

I have some code that checks the user's language. If the user is German they get sent to "de.html" otherwise they're sent to "en.html". There is also a string that checks if the user is going to the editor, ('/?edit'), and if so nothing happens. This code works fine, however, it doesn't work in IE. Any ideas?
var lang = window.navigator.language;
var userLang = window.navigator.userLanguage;
if (!window.location.href.includes('/?edit')) {
if (lang == "de" || userLang == "de") {
window.location.href = window.location.href + "de";
} else {
window.location.href = window.location.href + "en";
}
}
includes() is not supported in Internet Explorer (or Opera). You need to use indexOf() instead of includes()
if(window.location.href.indexOf('/?edit') === -1)
//check if `window.location.href` do not include `/?edit`

Remove Element When Page is Viewed using Internet Explorer

I have the following bit of code shown below:
<div class="timer" id="timer"><img src="http://i.imgur.com/87XaOWA.png"><p class="close-message" id="close-message"></p></div>
Now, when the page is viewed in Internet Explorer I want the div to be removed.
Since IE doesn't support the .remove() function I have found the following solution to circumvent the problem here. I have also found the following fiddle that can detect which browser is being used to view the page.
I've tried the following two if statements to remove the div tag when viewed in IE to no avail:
// Internet Explorer 6-11
var isIE = /*#cc_on!#*/false || !!document.documentMode
if (isIE = false) {
jQuery("#timer").eq(i).remove();
}
and
// Internet Explorer 6-11
var isIE = /*#cc_on!#*/false || !!document.documentMode
if (isIE = false) {
var node = document.getElementsById('timer')[i];
node.parentNode.removeChild(node);
}
What am I doing wrong? Individually the two components work fine, but when I try to use them together they don't work.
Your first error is:
if (isIE = false) {
you need to use a double equal sign for comparing, and in your case it should be:
if (isIE == true) {
The second error is:
document.getElementsById('timer')[i]
change it to:
document.getElementById('timer')
var isIE = /*#cc_on!#*/false || !!document.documentMode;
if (isIE == true) {
var node = document.getElementById('timer');
node.parentNode.removeChild(node);
}
//
// in jQuery: remove: .eq(i)....
//
if (isIE == true) {
jQuery("#timer").remove();
}
<div class="timer" id="timer"><img src="http://i.imgur.com/87XaOWA.png"><p class="close-message" id="close-message"></p></div>

How to block some devices and some browsers to prevent accessing my website?

Is there a javascript or something to block some devices and some browsers to prevent accessing my website
Only Chrome-in-Computers users can access it
like example:
www.example.com -- that can only access with Chrome Browsers in any device
www.example2.com -- that can only access with Firefox Browsers in Computers and
Androids
Here how you can do with javascript code:
var isChromium = window.chrome,
winNav = window.navigator,
vendorName = winNav.vendor,
isOpera = winNav.userAgent.indexOf("OPR") > -1,
isIEedge = winNav.userAgent.indexOf("Edge") > -1,
isIOSChrome = winNav.userAgent.match("CriOS");
if(isIOSChrome){
console.log('is Google Chrome on IOS');
alert('is Google Chrome on IOS');
} else if(isChromium !== null && isChromium !== undefined && vendorName === "Google Inc." && isOpera == false && isIEedge == false) {
console.log('is Google Chrome');
alert('is Google Chrome');
} else {
console.log('not Google Chrome');
alert('not Google Chrome');
}

page unload event not working in IE 9,10 randomly

I am trying to give alert to user if user click back button/press F5/ try to reload page.
I am using below script
<script type="text/javascript">
var testEvent = window.attachEvent || window.addEventListener;
var checkEvent = window.attachEvent ? 'onbeforeunload' : 'beforeunload';
testEvent (checkEvent , function (e) {
console.log(e);
var hdnCountValue= $("#" + '<%=hdnCount.ClientID %>').val();
console.log(hdnCountValue);
if (hdnCountValue!= null && hdnCountValue!= "" && hdnCountValue!= 'undefined' && parseInt(hdnCountValue) > 0) {
var msg = 'Warning: You will lose all your data.';
(e || window.event).returnValue = msg ;
return msg;
}
});
</script>
It is working fine in Firefox and chrome.
But in IE9 & 10 it is working sometimes & sometimes not.
And also in safari it works but when user choose to stay on page it changes URL, it shows previous page URL.

How to detect Firefox mobile with javascript?

I'm using the following code to detect whether the browser being used on my mobile site matches a certain crieteria:
var isiPhone = navigator.userAgent.match(/iPhone/i) != null;
if (isiPhone){ alert ('iphone');
but if I attempt to do this for Firefox / Mozilla, I can't get it to work. I've tried:
var isFirefox = navigator.userAgent.match(/Mozilla/i != null);
and
var isFirefox = navigator.userAgent.match(/Firefox/i != null);
I visited whatismyuseragent.com and got the following:
Mozilla/5.0 (Android;Linux armv7l; rv6.0) Gecko/20110811 Gecko Firefox/6.0 Fennec/6.0
Any idea how I properly detect this? I need to write some firefox specific code.
You can use the navigator.userAgent to detect the browser and navigator.platform to detect the current platform.
To Detect Firefox:
var is_firefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
To Detect Android:
var is_android = navigator.platform.toLowerCase().indexOf("android") > -1;
To Detect Both:
if(is_firefox && is_android)
//Do Work
I would recommend using something like modernizr to avoid browser detection and focus on feature detection.
var isFirefox = /Android.+Firefox\//.test(navigator.userAgent);
The mobile version of Firefox is Fennec, so just search for that:
var is_Firefox = navigator.userAgent.toLowerCase().indexOf('fennec') > -1;
None of the above functions were working for me, specifically buriwoy was detecting either android or firefox, this version of his function works:
function detectAndroidFirefox () {
var agent = navigator.userAgent.toLowerCase();
if(agent.indexOf('firefox') >= 0){
if(agent.indexOf("android") >= 0){
return true;
} else{
return false;
}
} else{
return false;
}
}
you can check from user agent if it's contain firefox or android, for this maybe you need some code with regex
Rion's answer doesn't work (at least anymore), because navigator.platform doesn't return Android, it returns Linux.
I wrote a function which seems to work:
function detectAndroidFirefox () {
var agent = navigator.userAgent.toLowerCase();
return (agent.indexOf('firefox') + agent.indexOf("android")) >= 0;
}
Thought maybe someone will need this.

Categories