I'm using VideoJS to as my
video player for a project I've been working on. Basically I have a div, and I wanted to have the
video player within that div, however when I load the page nothing happens, and the
video is never played. In fact, the
video is never loaded nor shown in the page. I basically copied the example from VideoJS' page. Any thoughts?
<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="example_video_1" class="video-js vjs-default-skin"
controls preload="auto" width="640" height="264"
poster="http://video-js.zencoder.com/oceans-clip.png"
data-setup='{"example_option":true}'>
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'></source>
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>></source>
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg'></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://video-js.zencoder.com/oceans-clip.mp4">MP4</a>,
<a href="http://video-js.zencoder.com/oceans-clip.webm">WebM</a>,
<a href="http://video-js.zencoder.com/oceans-clip.ogv">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-->
