Audio and Video in HTML5 - London Web Standards 20.09.2010
Last Monday I popped down to the capital, fighting through an annoying cold I've had for a week, to take part in a London Web Standards evening. To start off the proceedings, Google's Michael Mahemoff took us on a tour of some of the cool, but often overlooked new features of HTML5, such as application cache, local storage, geolocation. After that I tried to wow the crowd with a few insights into the capabilities offered by Audio and Video in HTML5.
And here are the examples I showed:
video
- Basic
video
example - Problem with plugins and overlapping HTML elements
- Fixing overlap problem in Flash with
wmode
- Native
video
with CSS3 Transitions - Basic JavaScript controllers for
video
- Fancy styled JavaScript-based
video
controls - Swapping
video
sources for simple playlists/galleries
As a bonus, I also mentioned WebSRT and the <track>
element (not part of HTML5), and showed the JavaScript demo implementation of WebSRT by Opera's Philip Jägenstedt as another example of how the native APIs for video
can be used in creative new ways.
audio
The first public outing of my audio
examples!