Does video tag (HTML 5) injection via JavaScript work in any browsers?

Posted by JoshNaro on Stack Overflow See other posts from Stack Overflow or by JoshNaro
Published on 2010-05-27T18:25:15Z Indexed on 2010/05/27 22:01 UTC
Read the original article Hit count: 174

I'm trying to dynamically spawn a video element on a page using JavaScript.

JavaScript

 <script type="text/javascript">
  $(document).ready(function() {
    var video = $(document.createElement('video'))
    .attr('id', 'VideoElement')
    .attr('controls', 'controls')
    .attr('src', 'videopath.mp4') // Changed 'href' attribute to 'src'
    .css({
      width: 640,
      height: 360
    });
  $('#VideoContainer').append(video);
});

HTML

<body>  
  <div id="VideoContainer"></div>
</body>

In Firefox I get the video harness, but the actual video doesn't load. In IE8 the video harness doesn't even appear.

Is HTML 5 just not supported enough to accomplish this yet?

Edit: Got this to work with Artiom's fix. Looks like this works fine with Chrome and Safari. I'm using a codec Firefox doesn't support, so it doesn't work there; although I suspect it will work with a supported codec. IE8 sure enough doesn't work (high five IE).

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about dynamic