This is work in progress – the next days I’ll write up See the related box to view a post about how to use the new HTML 5-video tag.

First Tests:

Safari 4 Macworks
Chrome 5 Macworks
Firefox 3.6 Macworks
Firefox 3.6 Windowsworks
Opera 10.10 Windowsno
Opera 10.5 Macno
Internet ExplorerLOL, no

Inline video in two formats with controls

Daft Punk 2007, Düsseldorf

Code

<video width="320" height="240" controls>
  <source src="/videos/daftpunk/DaftPunk_Concert.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
  <source src="/videos/daftpunk/DaftPunk_Concert.ogg" type='video/ogg; codecs="theora, vorbis"'>
</video>

Custom controls with javascript/mootools

Example video (h.264/ogg)

Current Event:

Ready State:

Network State:

Scriptable Controls







Timeline: Current time displayed, mouse wheel control
-
Volumeslider 1: Vertical, snap enabled, volume display
-
Volumeslider 2: Horizontal, no snap
 
Video Attributes



More to follow..