HTML5 Video Javascript

Question

I am not experienced in Javascript, I have the following script to play video files on Andriod phone, and it works fine.

 <script type="text/javascript">
        function PlayMyVideo(arg) {
            var myVideo = document.getElementById([arg]);
            myVideo.play();
        }
    </script>
<video id="what" src="what.mp4" poster="" />
<input type="button" onclick="PlayMyVideo('what')" value="Play" />

I am trying to write the tag on the fly:

  <script type="text/javascript">
        function PlayVideo() {
            new_video = document.createElement('video');
            new_video.setAttribute('scr', 'what.mp4'); 
            new_video.play(); 
         }
    </script>
<input type="button" onclick="PlayVideo()" value="Play2" />

Nothing happen, would appreciate your suggestions. Thanks in advance

score 4 · Answer 1 · edited Jul 18 '13 at 00:21

4

new_video.setAttribute('scr', 'what.mp4');

'scr' is misspelled. It should be 'src'.

and also you should wait for the movie to load before play

edited Jul 18 '13 at 00:21

CodingWithSpike

42,906
18
101
138

answered May 04 '13 at 13:38

Jinxmcg

1,830
1
21
24

score 2 · Answer 2 · answered Dec 26 '10 at 02:51

2

Well you're not appending the newly created tag to anything, so it can't play because it's in "memory"/"void", not on the screen.

<div id='plc'>&nbsp;</div>

<script type='text/javascript'>
function PlayVideo() {
new_video = document.createElement('video');
document.getElementById('plc').appendChild(new_video);
new_video.setAttribute('scr', 'what.mp4');
new_video.play();
}

answered Dec 26 '10 at 02:51

Slawek

762
4
7

Thanks, it created the video element; however the video did not play. – hncl Dec 26 '10 at 04:06
that's strange, maybe changing new_video.play() to window.onload = function() { new_video.play(); } would help – Slawek Dec 26 '10 at 06:31
Thanks Slawek, it did not work at first, then I changed ' to " for the scr and the original script you gave me first worked great but on iPad not on Android. – hncl Dec 26 '10 at 07:13
Just as a follow up, this tag works well on Android:. Since I have a number of video clips, I thought it will be more efficient to make it as javascript were I can use variable for the clip name. Thanks again – hncl Dec 26 '10 at 07:18

score 1 · Answer 3 · answered Dec 26 '10 at 02:52

1

you are creating the video element, you need to add it to the DOM before it will be visible, more info here: http://www.javascriptkit.com/javatutors/dom2.shtml

answered Dec 26 '10 at 02:52

John Boker

82,559
17
97
130

HTML5 Video Javascript

3 Answers3

Linked