Video Controls
This table lists the areas in which the built-in browser controls are different. For mobile devices, their touch controls, small screens and hardware buttons, result in a conceptually different UI than desktop browsers.
| Browser | Poster click | Controls visible | Time display | Volume control |
|---|---|---|---|---|
| Firefox 8 | starts video | idle, hover | elapsed, duration 1 | vertical slider |
| Firefox 11 | starts video | idle, hover | elapsed, duration 1 | vertical slider |
| Chrome 15 | does nothing | idle, hover, paused | elapsed | vertical slider |
| Safari 5.1 | does nothing | idle, paused, hover 2 | elapsed, remaining | vertical slider |
| Internet Explorer 9 | does nothing | hover | elapsed, remaining | horizontal slider |
| Opera 11.5 | does nothing | idle, paused, hover | elapsed, duration 3 | vertical slider |
| iOS 4 (iPod Touch 4) | starts video 4 | paused, touch | elapsed, remaining | hardware buttons |
| iOS 5 (iPad 1) | starts video 4 | paused, touch | elapsed, remaining | hardware buttons |
| Android 2.2 (HTC Legend) | does nothing | - 5 | elapsed, duration | hardware buttons |
| Android 2.3 (HTC Desire) | does nothing | idle, touch | elapsed, duration | hardware buttons |
| Android 4.0 (Galaxy S2) | does nothing | idle, touch 6 | elapsed, duration 7 | hardware buttons |
| WinPho 7.5 (Lumia 800) | starts video 4 | paused, touch | elapsed, duration | hardware buttons |
- Elapsed time is displayed as "tool tip" on seek bar.
- Before playback starts, most of the controls are missing.
- Both are shown to the right of the seekbar.
- A "play" icon is shown in the display
- With no controls when idle and no display click, it's impossible to start a video!
- After controls fade out in "windowed" mode, they don't appear anymore. Bug?
- Only in fullscreen mode, not in windowed mode.
Flash players
In comparison, here is how a few of the more popular Flash players do these things.
| Service | Poster click | Controls visible | Time Display | Volume Controls |
|---|---|---|---|---|
| YouTube | starts video 1 | always | elapsed, duration | horizontal slider |
| Vimeo | starts video | idle, hover | elapsed 2 | horizontal slider |
| Brightcove | does nothing | idle, hover | elapsed, duration | vertical slider |
| Ooyala | starts video 1 | paused, hover | elapsed, duration | vertical slider |
| Sublime | starts video 1 | paused, hover | elapsed | horizontal slider |
| Flowplayer | starts video 1 | hover | elapsed, duration | horizontal slider |
- A "play" icon is shown in the display
- Elapsed time is displayed as "tool tip" on seek bar.
Test video
This element contains both a WebM and MP4 source. Preload is set to none.