Dynamically inserting html5 video element doesn't work in Opera

I'm using JavaScript to insert video elements into the DOM but it doesn't work in Opera (v10.63). The element gets inserted but the video doesn't appear/play. Works in Firefox, Chrome and Safari. I'm still running some tests to see if I can get it to work but I just wondered whether anyone else had come across this issue.

On another note which might be helpful to others, it seems event delegation is only possible with Firefox and not Opera, Chrome or Safari. That's based on code tests I开发者_JAVA技巧've done so it could be wrong but I can't get it to work.

Many thanks

You could try using the HTML5 Inner Shiv. I know it's more aimed at IE, but it might be worth a shot.

It's possible to add the video element to the DOM using JavaScript in Opera 10.63. The code below, for example, should work (I tested it in Opera 10.61 and Opera 11).

var vid, makevid;
makevid = function(e){
    vid = document.createElement('video');
    vid.src = 'path/to/an/oggtheorafile.ogv';
        vid.setAttribute('autoplay',true);
    document.getElementsByTagName('body')[0].appendChild(vid);
} 
window.addEventListener('load',makevid,false);

You do have to be sure that you're using a compatible video format, though. Opera 10.63 supports Ogg/Theora and WebM. If you're using MPEG4/H.264, the video will not play in Opera.

(EDITED to correct video format support in Opera 10.6x. It does indeed support WebM)

EDIT 2: Note that if you use JavaScript to insert a video element in the DOM, you will also need to enable the controls by using vid.setAttribute('controls',true); or by creating custom controls.