Backstory:
I have just spent an entire day trying to work out why my HTML5 video and audio tags haven't been working in IE11 and IE10 when I upload them to a particular LMS (Works perfectly in every other browser).
I stripped it right back so that now this is everything that is in the HTML file.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>
<body>
<video controls>
<source src="video.mp4" height="450px" width="800px"/>
</video>
</body>
</html>
Very simple as you can see, works locally in IE11 and IE10, and the files are definitely on the LMS as I can link to them. It is only when they are in HTML5 video tags that nothing appears - literally a white screen.
The Issue:
When the content is loaded by the LMS, there are a series of nested frames, as seen below. (note that I removed all inline properties {there are heaps}).
<html>
<head></head>
<frame>
<frame>
<frame>
// This is where my HTML lives.
In the top head tag, which I can't alter, lies this bad boy: <meta http-equiv="X-UA-Compatible" content="IE=8">
. Now I may be incorrect, but I think this is the source of the issue, as ie8 document standard would be negating any HTML5 tags...?
The Question:
Is there any way to over-write this meta tag with <meta http-equiv="X-UA-Compatible" content="IE=edge">
?
Or subsequently, can I reconfigure the document standards / mode, without refreshing the page (refreshing automatically closes the window {LMS/SCORM function}), either within my frame or above with javascript etc..? Or do I need to try and get the LMS Tech peeps to alter their source code?
Update:
Noticed the following when I add <meta http-equiv="X-UA-Compatible" content="IE=8">
The DOM changes from the original to:
<video controls></video>
<source src="video.mp4" height="450px" width="800px"/>
</video><//video>