I have content that is loaded into a standard frame. I have no control over the parent frame which is forcing the browser into IE5 Quirks mode. Now within my own content I am attempting to change the src of an iframe. I am using the following code:
function loadIframe(iframeName, url) {
var $iframe = $('#' + iframeName);
if ( $iframe.length ) {
$iframe.attr('src',url);
return false;
}
return true;
}
loadIframe('frameID', '../myhtmlpage.html');
The issue is that when I attempt to load the new src into the iframe, the entire window reloads. I am pretty sure that this is related to IE5Quirks mode because if I pull up IE Developer tools and change to Standards mode, the iframe loads as expected. How can I get the iframe to load without issues?
From your comment:
I don't have any control over the page that is being rendered in quirks mode; however, my content must be loaded into a standard frame on that page.
I'm afraid to tell you that you are out of luck.
IE does not support mixed rendering modes between frames on the same page. If the main page is in quirks mode, then all frames or iframes within that page will also be in quirks mode, even if they are written to be standards compliant.
This just how it works, and you cannot override it.
Your options, as I see them:
Find a way to upgrade the parent page so that it no longer needs Quirks mode. (I appreciate that this option may not be open to you, but frankly it's shocking that anyone is still using quirks mode in 2015; the managers who think they're saving money by not upgrading whatever obsolete system this is need to be given a wake-up call)
Downgrade your page so it can work in quirks mode. Note that if you're using any modern browser features, then this option may not be possible as Quirks mode will disable those features in the name of being compatible with IE5.
Open your content in a pop-up window instead of a frame. This seems like it's probably the most pragmatic option. It's almost certainly going to be the least amount of work (be an order or magnitude). It may not look as good as if it's in an iframe, but at least it'll work.
Related
Problem - We are trying to migrate our application to use IE Edge mode (we are using IE 11 browser). Our application consists of a top level page and a child iframe to load third party applications (which may load from a domain which is different from parent page domain). As part of migration, parent level page now loads in Edge mode (using IE=Edge value for X-UA-Compatible meta tag)
Question - Can i be absolutely sure that iframe page will always render in Edge mode as well (irrespective of its malformed content or the use of X-UA-Compatible meta tag with a different content value)? Is there any official msdn document confirming the same?
Note:
I checked this msdn link, but it mainly explains IE9 behavior, and it also talks about the case where an iframe cannot have document mode higher than that of parent page.
Based on my understanding, the accepted answer to this question seems to indicate that iframe will also render in Edge mode, but i am not entirely sure.
Any help is appreciated! Thank you.
As from https://msdn.microsoft.com/en-us/library/jj676915%28v=vs.85%29.aspx :
As of IE9 mode, webpages cannot display multiple document modes. For
example, consider a standards-based webpage that contains a frame
element that displays content in quirks mode. IE9 mode displays the
child frame in standards mode (because the parent document is in
standards mode). Starting with Internet Explorer 10, however, child
frames can emulate quirks mode. For more info, see IEBlog: HTML5
Quirks mode in IE10. For best results, however, use document modes
consistently.
This means that If you set the X-UA-Compatible meta tag, if IE version is newer than 9 it will display the current window and all child browsing contexts in Edge mode. If the IE version is 8 (the version in which this meta tag is introduced), this can render child contexts using different rendering mode.
I am reading and looking for answer for days and couldn't found one, hopefully this thread will bring salvation :)
In my company we have a web app that is working on IE8.
We are trying to migrate to IE11.
We almost there but,
We have an old module that is written in an old framework that is hosted in an iframe and running in quirks mode(define with meta http-equiv="X-UA-Compatible" content="IE=emulate7" or IE=5, I tried both).
As long as the parent/main window is rendered in IE8 document mode (via x-ua-compatible meta tag) or in enterprise mode, the iframe works fine.
But as soon as I change the parent/main window to IE=9 and above, I get javascript errors from the child iframe (more than I can handle).
I understand that IE11 uses emulator for quirks mode and not the real engine, but I can not find anywhere details about the javascript engine.
Does this mean that if the parent main window is rendered is IE9 and above, the child iframe will use ECMAscript 5 and not jscript as it should?
is there any solution to my problem?
thanks guys!
Starting with IE10, the child mode can be different from the parent.
See this link. It says...
IE9 mode displays the child frame in standards mode (because the
parent document is in standards mode). Starting with Internet Explorer
10, however, child frames can emulate quirks mode. For more info, see
IEBlog: HTML5 Quirks mode in IE10. For best results, however, use
document modes consistently.
Starting with IE9, frames were limited to the document of the parent document, e.g. if the parent document rendered in standards mode, child frames were forced to render likewise.
Perhaps one approach would be to revise things so that your IE9+ window presents links to open your legacy app in a new parent window, one that presents whatever document mode your child frame requires.
You can use showModelessWindow to open a child window containing a separate HTML file, one that initiates the correct document mode in the parent document...and then loads the IFRAME you're working with. Example code:
var sOptions = "scroll: no; status: no; resizable: yes;";
window.showModelessDialog("myFrameContainer.html", "", sOptions );
I'm developing a data visualization page for an intranet using d3.js. The page needs to render in Internet Explorer, which causes trouble since all the intranet pages are rendered in quirks mode. This makes IE throw an error when loading d3: SCRIPT5009: CSSStyleDeclaration is undefined, which then prevents the rest of d3 from loading.
The page works as intended when rendered by by other modern browsers or by IE9 in standards mode, so I believe quirks mode is the problem.
Other limitations, and things I've tried that don't work:
The page is served by a templating system (IBM Cognos) I don't have control over. Setting <meta http-equiv="X-UA-Compatible" content="IE=edge"> is therefore not an option, since I can't modify the header.
Setting the equivalent tag in the HTTP header is also not possible.
If I add a meta tag to the <body>, the only part of the page I have any control over, IE will ignore it.
IE's F12 tools claims it's in document quirks mode, although the browser itself is in IE9 compatibility mode. Changing the document mode manually causes the intranet site to reload the page and navigate back to the parent page. I have no idea why.
Unchecking "Display intranet sites in Compatibility View" in the compatility view settings does nothing.
At the moment I can think of two ways to solve this: either force IE to render in standards mode, or somehow rewrite d3.js so as to avoid using CSSStyleDeclaration, which causes the crash in the first place. I have no idea how to proceed for either of these.
I tried to use document.querySelectorAll(), but IE8 throw error, that
Object doesn't support this property or method
var titleCheckBox = document.querySelectorAll("");
Here http://www.quirksmode.org/dom/w3c_core.html#t13 written, that IE8 support this method.
What I doing wrong?
Check that your page isn't in Quirks mode or Compatibility mode. You can use the F12 dev tools to confirm this. Press F12 and look in the top-right corner of the resulting window. If you see "Compatibility" or "Quirks" in the mode description, then you've found the problem.
Quirks mode: this is usually triggered by a missing or broken Doctype. If this is the case, make sure your page starts with the following:
<!DOCTYPE html>
Compatibility mode (IE7 mode): This may be triggered if you're viewing the page locally (ie running it on your local machine, eg for testing, or on your local network). In this case, you are being hit by an IE config setting that you should disable. Go to the Tools menu, and pick the Comaptibility View Settings option. Untick the compatibility options, and the page should start working.
Compat mode may also be triggered (or avoided) by an X-UA-Compatibility meta tag. If you're having trouble with compatibility mode, this is a good way to avoid it: Add the following line to your code:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
Either (or both) of the above could be the problem, but my guess is that the problem is compatibility mode. The compat-mode-on-intranet-sites setting is suprisingly little known, and catches a lot of people out, even some seasoned developers.
IE8 only supports querySelectorAll() in standards mode. From MSDN:
The Selectors API is defined as part of the Selectors API specification and is only available to Web pages displayed in IE8 standards mode.
Chances are your page doesn't have a proper DOCTYPE declaration; you will need to add one.
I am currently in development of a bookmarklet that triggers a fancybox Iframe when an image is clicked on a website. This bookmarklet works great in all browsers except IE 9's Quirks Mode. In fact, it not only screws up the rendering of items on the screen, but items within the Iframe as well. I'm looking for a solution to force IE into standards mode. Especially on pages where there is no Doctype declared. In fact a static image on a page is our current test for the bookmarklet.
Success equals -
1. Launching the bookmarklet on a Quirks Mode page
2. Having the fancybox iframe load in the proper location on screen with proper rendering
Thanks in advance for any help that can be provided.
I'm looking for a solution to force IE into standards mode.
I'm pretty sure there is no way. Changing the rendering mode with Javascript just wouldn't be a scenario that anyone would consider necessary or beneficial; your use-case is just too obscure.
Success equals - 1. Launching the bookmarklet on a Quirks Mode page 2. Having the fancybox iframe load in the proper location on screen with proper rendering
If fancybox won't work, then try out alternative solutions: http://www.google.com/search?q=jquery%20lightbox