Internet Explorer/Edge detector not displaying JQuery dialog
I'm attempting to make a warning for when users visit my site while using either Internet Explorer or Edge, but the code I have simply displays nothing.
The IE/Edge Detector:
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
// Do stuff here
}
My HTML:
<body>
<!-- IE Alert -->
<div id="unsupported-browser" title="Browser Not Supported" style="display:none;text-align:center;">
<p>
Uh Oh! Your browser is not supported!
Downloading a newer browser is recommended for safety and security!
Download one of the following browsers for an optimal experience!
<a href="https://www.mozilla.org/en-US/firefox/new/" target="_blank">Mozilla Firefox</a>
<a href="https://www.google.com/chrome/index.html" target="_blank">Google Chrome</a>
</p>
</div>
</body>
My JQuery (With IE/Edge detector):
$(document).ready(function () {
$('#unsupported-browser').dialog({
autoOpen: false,
width: 600,
buttons: {
"Ok": function () {
$(this).dialog("close");
},
"Cancel": function () {
$(this).dialog("close");
}
}
});
// Detect Internet Explorer/Edge
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
$(function () {
$('#unsupported-browser').dialog('open');
return false;
});
}
});
I believe the problem is somewhere in the dialog, as when I use alert(); inside the detector, the alert displays just fine. removing display:none; inside the div's style also has no effect.
javascript jquery
asked Nov 19 '18 at 22:06
KixironKixiron
13
add a comment |
I'm attempting to make a warning for when users visit my site while using either Internet Explorer or Edge, but the code I have simply displays nothing.
The IE/Edge Detector:
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
// Do stuff here
}
My HTML:
<body>
<!-- IE Alert -->
<div id="unsupported-browser" title="Browser Not Supported" style="display:none;text-align:center;">
<p>
Uh Oh! Your browser is not supported!
Downloading a newer browser is recommended for safety and security!
Download one of the following browsers for an optimal experience!
<a href="https://www.mozilla.org/en-US/firefox/new/" target="_blank">Mozilla Firefox</a>
<a href="https://www.google.com/chrome/index.html" target="_blank">Google Chrome</a>
</p>
</div>
</body>
My JQuery (With IE/Edge detector):
$(document).ready(function () {
$('#unsupported-browser').dialog({
autoOpen: false,
width: 600,
buttons: {
"Ok": function () {
$(this).dialog("close");
},
"Cancel": function () {
$(this).dialog("close");
}
}
});
// Detect Internet Explorer/Edge
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
$(function () {
$('#unsupported-browser').dialog('open');
return false;
});
}
});
I believe the problem is somewhere in the dialog, as when I use alert(); inside the detector, the alert displays just fine. removing display:none; inside the div's style also has no effect.
javascript jquery
asked Nov 19 '18 at 22:06
KixironKixiron
13
Support for IE conditional comments got dropped in IE10. What version are you testing against? Also this will bloat your page. Might consider a redirect instead to an explanation page
– charlietfl
Nov 19 '18 at 22:10
For anyone who runs into this problem, you also have to import the JQuery UI with<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
– Kixiron
Nov 19 '18 at 22:14
add a comment |
I'm attempting to make a warning for when users visit my site while using either Internet Explorer or Edge, but the code I have simply displays nothing.
The IE/Edge Detector:
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
// Do stuff here
}
My HTML:
<body>
<!-- IE Alert -->
<div id="unsupported-browser" title="Browser Not Supported" style="display:none;text-align:center;">
<p>
Uh Oh! Your browser is not supported!
Downloading a newer browser is recommended for safety and security!
Download one of the following browsers for an optimal experience!
<a href="https://www.mozilla.org/en-US/firefox/new/" target="_blank">Mozilla Firefox</a>
<a href="https://www.google.com/chrome/index.html" target="_blank">Google Chrome</a>
</p>
</div>
</body>
My JQuery (With IE/Edge detector):
$(document).ready(function () {
$('#unsupported-browser').dialog({
autoOpen: false,
width: 600,
buttons: {
"Ok": function () {
$(this).dialog("close");
},
"Cancel": function () {
$(this).dialog("close");
}
}
});
// Detect Internet Explorer/Edge
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
$(function () {
$('#unsupported-browser').dialog('open');
return false;
});
}
});
I believe the problem is somewhere in the dialog, as when I use alert(); inside the detector, the alert displays just fine. removing display:none; inside the div's style also has no effect.
javascript jquery
asked Nov 19 '18 at 22:06
KixironKixiron
13
I'm attempting to make a warning for when users visit my site while using either Internet Explorer or Edge, but the code I have simply displays nothing.
The IE/Edge Detector:
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
// Do stuff here
}
My HTML:
<body>
<!-- IE Alert -->
<div id="unsupported-browser" title="Browser Not Supported" style="display:none;text-align:center;">
<p>
Uh Oh! Your browser is not supported!
Downloading a newer browser is recommended for safety and security!
Download one of the following browsers for an optimal experience!
<a href="https://www.mozilla.org/en-US/firefox/new/" target="_blank">Mozilla Firefox</a>
<a href="https://www.google.com/chrome/index.html" target="_blank">Google Chrome</a>
</p>
</div>
</body>
My JQuery (With IE/Edge detector):
$(document).ready(function () {
$('#unsupported-browser').dialog({
autoOpen: false,
width: 600,
buttons: {
"Ok": function () {
$(this).dialog("close");
},
"Cancel": function () {
$(this).dialog("close");
}
}
});
// Detect Internet Explorer/Edge
var isIE = /*@cc_on!@*/ false || !!document.documentMode,
isEdge = !isIE && !!window.StyleMedia;
if (isIE || isEdge) {
$(function () {
$('#unsupported-browser').dialog('open');
return false;
});
}
});
I believe the problem is somewhere in the dialog, as when I use alert(); inside the detector, the alert displays just fine. removing display:none; inside the div's style also has no effect.
javascript jquery
javascript jquery
asked Nov 19 '18 at 22:06
KixironKixiron
13
asked Nov 19 '18 at 22:06
KixironKixiron
13
asked Nov 19 '18 at 22:06
KixironKixiron
13
asked Nov 19 '18 at 22:06
KixironKixiron
13
asked Nov 19 '18 at 22:06
KixironKixiron
13
13
Support for IE conditional comments got dropped in IE10. What version are you testing against? Also this will bloat your page. Might consider a redirect instead to an explanation page
– charlietfl
Nov 19 '18 at 22:10
For anyone who runs into this problem, you also have to import the JQuery UI with<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
– Kixiron
Nov 19 '18 at 22:14
add a comment |
Support for IE conditional comments got dropped in IE10. What version are you testing against? Also this will bloat your page. Might consider a redirect instead to an explanation page
– charlietfl
Nov 19 '18 at 22:10
For anyone who runs into this problem, you also have to import the JQuery UI with<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
– Kixiron
Nov 19 '18 at 22:14
Support for IE conditional comments got dropped in IE10. What version are you testing against? Also this will bloat your page. Might consider a redirect instead to an explanation page
– charlietfl
Nov 19 '18 at 22:10
Support for IE conditional comments got dropped in IE10. What version are you testing against? Also this will bloat your page. Might consider a redirect instead to an explanation page
– charlietfl
Nov 19 '18 at 22:10
For anyone who runs into this problem, you also have to import the JQuery UI with
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>– Kixiron
Nov 19 '18 at 22:14
For anyone who runs into this problem, you also have to import the JQuery UI with
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>– Kixiron
Nov 19 '18 at 22:14
add a comment |
1 Answer
1
active
oldest
votes
For anyone who runs into this problem, you also have to import the JQuery UI with <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> inside your html file
answered Nov 19 '18 at 22:15
KixironKixiron
13
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53383310%2finternet-explorer-edge-detector-not-displaying-jquery-dialog%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
For anyone who runs into this problem, you also have to import the JQuery UI with <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> inside your html file
answered Nov 19 '18 at 22:15
KixironKixiron
13
add a comment |
For anyone who runs into this problem, you also have to import the JQuery UI with <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> inside your html file
answered Nov 19 '18 at 22:15
KixironKixiron
13
add a comment |
For anyone who runs into this problem, you also have to import the JQuery UI with <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> inside your html file
answered Nov 19 '18 at 22:15
KixironKixiron
13
For anyone who runs into this problem, you also have to import the JQuery UI with <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> inside your html file
answered Nov 19 '18 at 22:15
KixironKixiron
13
answered Nov 19 '18 at 22:15
KixironKixiron
13
answered Nov 19 '18 at 22:15
KixironKixiron
13
answered Nov 19 '18 at 22:15
KixironKixiron
13
13
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53383310%2finternet-explorer-edge-detector-not-displaying-jquery-dialog%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Support for IE conditional comments got dropped in IE10. What version are you testing against? Also this will bloat your page. Might consider a redirect instead to an explanation page
– charlietfl
Nov 19 '18 at 22:10
For anyone who runs into this problem, you also have to import the JQuery UI with
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>– Kixiron
Nov 19 '18 at 22:14