Upon loading, a JavaScript checks if the browser supports HTML5 video.

The JavaScripts checks what video files are supported.

The JavaScript determines which videofile is used.

Safari supports video/x-m4v, video/mpeg, video/ogg (if installed) and video/mp4.

Firefox only supports video/ogg.

Flock and Microsoft Internet Explorer do not support HTML5 and show a Flash videoplayer.

So use all browsers to see the difference.

The demo uses a .m4v (h.264) and an ogg file.

The purpose to do it this way is to be able to show a lot of videofiles on a page without loading them all at the same time.

It is a quick sample. It needs finetuning. A routine should be made to disable a current video when a new video is clicked.

Here’s the page that is displayed in the HTML Snippet. Use as many pages as you need. And study/clean up the code.

http://www.wyodor.net/_Demo/html5/video/html5video.html

To convert to ogg, download the software here : http://www.vorbis.com/software/