HTML 5 Videos
<video id="sampleMovie" width="640" height="360" preload controls> <source src="HTML5Sample_H264.mov" /> </video>
<video id="sampleMovie" width="640" height="360" preload controls> <source src="HTML5Sample_Ogg.ogv" /> </video>
<video id="sampleMovie" width="640" height="360" preload controls> <source src="HTML5Sample_WebM.webm" /> </video>
<video id="sampleMovie" width="640" height="360" preload controls> <source src="HTML5Sample_H264.mov" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> <source src="HTML5Sample_Ogg.ogv" type='video/ogg; codecs="theora, vorbis"' /> <source src="HTML5Sample_WebM.webm" type='video/webm; codecs="vp8, vorbis"' /> </video>
<video id="example_video_1" class="video-js vjs-default-skin"
controls preload="none" width="auto" height="auto"
poster="path/to/image.png"
data-setup='{"example_option":true, "autoplay": true}'>
<source src="path/to/video.ogv" type='video/ogg' />
<source src="path/to/video.webm" type='video/webm' />
<source src="path/to/video.mp4" type='video/mp4' />
<!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
<object class="vjs-flash-fallback" width="640" height="360" type="application/x-shockwave-flash" data="http://teachers.dadeschools.net/jrios/students/p03s17/multimedia/videos/HTML5Sample_H264.flv">
<param name="movie" value="http://teachers.dadeschools.net/jrios/students/p03s17/multimedia/videos/HTML5Sample_H264.flv" />
<param name="allowfullscreen" value="true" />
<param name="flashvars" value='config={"playlist":["path/to/image.png", {"url": "path/to/video.flv","autoPlay":false,"autoBuffering":true}]}' />
<!-- Image Fallback. Typically the same as the poster image. -->
<img src="path/to/image.png" width="640" height="264" alt="Poster Image" title="No video playback capabilities." />
</object>
</video>