HTML 5 Demos and Examples
HTML 5 experimentation and demos I've hacked together. Click on the browser support icon or the technology tag to filter the demos (the filter is an OR filter).
Introducing HTML5 by Bruce Lawson & Remy Sharp is the first full length book dedicated to HTML5.
Get it now and kick some HTML5 ass!
workers
| Demo | Support | Technology |
|---|---|---|
| Simple class manipulation | chrome: live | classlist |
| Storage events | chrome: live | storage |
| dataset (data-* attributes) | chrome: live | dataset |
| History API using pushState | chrome: live | history |
| Browser based file reading Not part of HTML5 | chrome: live | file-api |
| Drag files directly into your browser Not directly part of HTML5 | chrome: live | file-api dnd |
| Simple chat client | chrome: live | websocket |
| Two videos playing in sync | chrome: live | video |
| Interactive canvas gradients | chrome: live | canvas |
| Canvas & Video | chrome: live | video canvas |
| Video | chrome: live | video |
| Canvas | chrome: live | canvas |
| Content Editable | chrome: live | contenteditable storage |
| Geolocation Works on Safari Mobile too | chrome: live | geolocation |
| postMessage same domain | chrome: live | postMessage |
| postMessage cross domain | chrome: live | postMessage |
| drag and drop | chrome: live | dnd |
| drag anything | chrome: live | dnd |
| offline detection Works on Safari Mobile too | chrome: none | offline events |
| navigator.onLine tests Doesn't use events, only polls | chrome: none | offline |
| on/offline event tests | chrome: none | offline events |
| offline application using the manifest FF 3.6 is still buggy - doesn't request manifest after initial load | chrome: live | offline manifest |
| Storage | chrome: live | storage |
| Web SQL Database Storage | chrome: live | sql-database |
| Web SQL Database - rollback test | chrome: live | sql-database |
| Web Workers watch out - uses a lot of CPU! example without - will hang your browser | chrome: live | workers |
All content, code, video and audio is Creative Commons Share Alike 2.0