This website displays fine in Chrome & Firefox, but displays as left-aligned in IE9, and the image gallery is skewed also.
I don't understand why IE9 would be showing such a different display.
A 3rd party web firm had altered the Opencart template to include a script element before the head element, which apparently puts IE into quirks mode.
Thanks to Frankie on CodingForums.com for fixing this for me.
His post:
By putting this before the doctype, you ordered IE into quirks mode:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$.noConflict();
jQuery(document).ready(function() {
jQuery(".the-content").hide();
jQuery(".the-head").click(function() {
jQuery(this).next(".the-content").slideToggle(500);
});
});
</script>
<?xml version="1.0" encoding="UTF-8"?>
Put it inside the head. And you can delete the last line. You don't need that, and it sets off IE6.
Related
The following code snippets highlights what I consider to be a bug (or is it a feature?) in MS Edge and Firefox: a PDF file is downloaded when displaying the page, even though it is hidden.
Chrome and (not surprisingly) MS Edge Chromium, do not download until the element is visible, which I what I would expect.
<html>
<head>
<title>Test Embedded PDF</title>
<body>
<!-- ... explanation text removed ... -->
<div style="display:none">
<object id="pdf-view" data="https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" type="application/pdf" style="width:100vw;height:100vh;"></object>
</div>
</body>
</html>
Screenshot: On Chrome - PDF IS NOT downloaded
Screenshot: On Firefox - PDF IS downloaded, despite the fact that it is hidden
Has anyone encountered this, and is there a work-around?
Thank you
Our application uses embedded IE control, and we noticed that setting:
document.body.innerHTML it to <P><HR> causes an OLE exception "Unknown runtime error".
I could reproduce this in the IE browser itself (IE version 8).
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Untitled</title>
<script>
function load(){
// alert(document.body.innerHTML)
document.body.innerHTML = '<P><HR>';
}
</script>
</head>
<body onload="load()">
</body>
</html>
If the body.innerHTML is set to <P></P><HR> all is good. but the problem that the HTML strings are coming from a DB. Why is this happening and how can this be fixed?
EDIT: The code works fine on IE11. but the problem exists on systems with IE8. no matter if I change FEATURE_CONTROL_BROWSER_EMULATION key. Is there anything could be done for IE8?
The MSIE WBC (Web browser control), whether hosted by a Delphi or .net desktop application use IE7 Emulation by default.... To determine which IE emulation mode your hosted WBC is using add the following snippet to the onload event.
alert(document.documentMode?document.documentMode:'n/a');
To make your WBC use the IE emulation mode you need to add a registry entry in the FEATURE_CONTROL_BROWSER_EMULATION key in the registry.
see the documentation here - https://msdn.microsoft.com/en-us/library/ms537184%28v=vs.85%29.aspx
to get your invalid markup to work.
1. use a valid document type declaration. ().
2. change your FEATURE_CONTROL_BROWSER_EMULATION value in the registry to emulate IE8 or higher....
Ideally you want your WBC to emulate IE11 and modern web standards for html5, but that may not be possible if your existing markup is pre-HTML5,CSS 3.(viz: your markup was developed for IE6 on an intranet website, using DHTML (the early MS versions of HTML).
i was wondering if it was possible to completly change the site, when viewed in IE?
Like have a site that would only work in IE?
As of right now, my site doesn't work quite as i wanted it, in IE9 or below, and i thought of making a different site simply saying something in the lines of "Your browser is outdated, please update 'LINK' ".
I dont want to put a banner on my website, as the website will still be seen behind it, and trust me, it is really ugly in IE9 and below.
Unless i can make the banner take up the entire page somehow?
Please help a new guy..
Cheers!
You can use something like WhichBrowswer to detect what browser/version someone is using and then redirect them to another page. All of this can be done in a few simple lines of js
An example:
$(document).ready(function() {
Browsers = new WhichBrowser();
if(Browsers.isBrowser('Internet Explorer', '<=', '9')) {
window.location.replace("http://example.com/upgrade-browser");
}
});
Use conditional statements in the head of your html (index.html) document that will specify what to do with specific IE browsers. See below for example for an IE 9 or less stylesheet. Below is saying if the user is on IE 9 or less then use this stylesheet and you can write specific styles. Also see the article link below for a detailed explanation.
<!--[if lte IE 9]>
<link href="/css/ie.css" type="text/css" rel="stylesheet" media="screen, projection" />
<![endif]-->
Reference - http://www.quirksmode.org/css/condcom.html
I detect if a user has chrome frame by placing this in teh body of my page:
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"> </script>
<div id="placeholder"></div>
<script>
CFInstall.check({
node: "placeholder",
destination: "http://www.waikiki.com"
});
</script>
In the header of my boilerplate page I have:
<meta http-equiv="X-UA-Compatible" content="chrome=1">
I managed to get the site to prompt me to install chrome frame, which I did, but the page still renders with IE errors, any ideas why?
Using IE7.
You can tell if the page is using chrome frame by right clicking on the page. If the context menu lists "About Chrome Frame.." it's rendering the page via chrome frame plugin.
Also you need to call CFInstall.check after the body is loaded.
I have a like box setup in my website using the following code as exampled by Facebook.
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like-box href="http://www.facebook.com/platform" width="292" show_faces="true" stream="true" header="true"></fb:like-box>
It works in all browsers (Chrome, Safari, Opera, Firefox, IE7, IE8) but not IE9. On inspecting the code it still reads the same as above, whereas the others get replaced with an iFrame.
I have also tried adding the following line to the html element, although this did not help.
xmlns:fb="http://www.facebook.com/2008/fbml"
Does anyone know how to resolve this issue?
The iframe version of the like box does however work, but XFBML is more desired.
Not sure why it is not working in IE9, but changing the document mode to IE8 will make it work -you can do that by adding this to the head section
<meta http-equiv="X-UA-Compatible" content="IE=8" >
Ref: http://msdn.microsoft.com/en-us/library/cc288325%28v=vs.85%29.aspx
You can add facebook namespaces to the head of your HTML. Just make sure you format correctly.
<html xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraphprotocol.org/schema/">
<body>
<!-- My super great XFBML like button -->
</body>
</html>
I have the same problem and I found the solution for me:
I'm using blogger template which by default contain this tag:
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
I deleted it and everything is working good.