html5 player not playing

Question

I'm trying to use VideoJS in a website I'm developing (http://videojs.com/), however I'm trying to load a simple YouTube video on the page for testing purposes but still not working:

 <div class="video-js-box">
            <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
         <div style="position: absolute; top: 50px; left: 600px; display:none">
            <video id="my_video_1" class="video-js vjs-default-skin" controls
              preload="auto" width="640" height="264" poster="my_video_poster.png"
              data-setup="{}">
              <source src="http://www.youtube.com/watch?v=ehjDXDVpLgo" type='video/mp4'></source>
              <source src="http://www.youtube.com/watch?v=ehjDXDVpLgo" type='video/webm'></source>
            </video>
            <!-- Download links provided for devices that can't play video in the browser. -->
            <p class="vjs-no-video"><strong>Download Video:</strong>
              <a href="http://www.youtube.com/watch?v=ehjDXDVpLgo">MP4</a>,
              <a href="http://www.youtube.com/watch?v=ehjDXDVpLgo">WebM</a>,
              <a href="http://www.youtube.com/watch?v=ehjDXDVpLgo">Ogg</a><br>
              <!-- Support VideoJS by keeping this link. -->
              <a href="http://videojs.com">HTML5 Video Player</a> by VideoJS
            </p>
          </div>    
        <div style="clear:both;"></div>
    </div><!--main-->

And on the of the page I have:

<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
  <script src="http://vjs.zencdn.net/c/video.js"></script>

Any clues what's going wrong here? I was expecting to be able to load and play that video on my page.

Your youtube links are links to the HTML page not to the video source or the swf file. — Larry Battle, Jun 17 '12 at 05:31
Could you also post your code sample for the video hosted on your site? — Larry Battle, Jun 17 '12 at 05:50
@philippe - No you did not. (at least in the code you posted up there) — Derek 朕會功夫, Jun 17 '12 at 05:52

score 1 · Accepted Answer · edited May 23 '17 at 12:29

Don't use Youtube video to test videojs, since it's hard to find a direct link to the video source. Check this out this question.

The code your provided links to the youtube page not to video source.

<source src="http://www.youtube.com/watch?v=ehjDXDVpLgo" type='video/mp4'></source>

The video source might be hidden in here but I'm not sure. Use your own videos hosted on your site to test.

But if you still want to use youtube videos then check out the Video.js forum, where someone provides code for a workaround.

An easier way to embed youtube videos would be to click the "share" then "embed" tab under a video page and copy and paste the code on your site. Which would give you something like this.

<iframe width="560" height="315" 
    src="http://www.youtube.com/embed/gZKXrLjCwa8"
    frameborder="0" allowfullscreen>
</iframe>

Also I would suggest reading the Video.js documentation again on how to setup.

html5 player not playing

1 Answers1