Here is a script that appends the markup for an html5 video to the DOM:
document.body.innerHTML = '<video id="video" controls="controls" src="http://mirror.cessen.com/blender.org/peach/trailer/trailer_iphone.m4v" type="video/mp4"></video>';
var el = document.getElementById('video');
document.body.removeChild(el);
document.body.appendChild(el);
jsfiddle demo: http://jsfiddle.net/h8RLS/2/
This works in all browsers tested, except for Safari on iOS. In iOS, when the HTMLVideoElement is re-appended to the DOM, it is no longer playable.
Has anyone else resolved or encountered this issue?
I don't have an iPad but could reproduce your issue on an iPhone. This seems to be a Webkit error but it can be bypassed easily by changing the src
attribute of the video - I hope this is sufficient for your scenario. You can see a working demo here:
http://vidhtml5.appspot.com/jsembed.html
This is the code:
var el = document.getElementById('video');
el.src= "http://mirror.cessen.com/blender.org/peach/trailer/trailer_iphone.m4v";
el.load();
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With