7 ms·

html5media.js enables HTML5 video and audio tags in all major browsers

89 points by ryanwhitney 15y ago

drivebyacct2 15y ago
Uhm, does it fallback? How much faster is it than it's competitors, seeing as it's competitors have been around much longer and have many more features?
- ryanwhitney 15y ago
  I've only messed around with it a bit, but yes it has flash fallback.
- etianen 15y ago
  html5media was actually one of the first solutions out there. It's recently been re-launched with a faster, hosted CDN. It's speed should be one of the best out there, as it's a single tiny javascript file that's heavily cached and shared between all websites.
themanr 15y ago
Looks like it requires transcoding video for Firefox support as there seems to be no way to force it to use flash in that case. Does it work with content dynamically inserted into the DOM? A quick glance at the source indicates otherwise.
- etianen 15y ago
  You can call html5media() at any time to kick in the fallback for any new video or audio tags that have been inserted into the DOM.
ericmoritz 15y ago
Does this act as a shim supporting the same API as the HTML5 tags?
- etianen 15y ago
  Unfortunately, providing the same JS media API for the Flash fallback is a massive task. There's a few solutions out there that provide a consistent API, such as mediaelement.js, but it's not the standard JS media API, and their overhead is much higher. html5media aims to be the smallest, fastest solution available. It's a little low on features, but it's great for embedding videos with an absolute minimum of fuss and effort.
5h 15y ago
Call me old fashioned, but saying "all major browsers" is one thing, yet I'd still sure like to see a list of what the author considers major...
- ryanwhitney 15y ago
  IE 6-9 are covered
  - deleted 15y ago
    [deleted]
  - cincinnatus 15y ago
    There really needs to be a detailed list in the main read me.
eekfuh 15y ago
Looks cool, but def needs some CSS additions to the play button, "cursor: pointer;" plus the other controls need the cursor property to be set to the proper thing.
- etianen 15y ago
  The styling of the controls are entirely at the whim of the user's browser. Unlike other players, html5media uses the native controls provided by the browser. The Firefox and Safari controls are rather sweet. The Chrome ones are a little basic at the moment.
philfreo 15y ago
Does JavaScript Audio() work also?
- lautis 15y ago
  No. The scope of plugin seems to be to enable audio and video tags, not to provide JS API. Html5media basically just replaces each video and audio tag with FlowPlayer (swf video/audio player) instances if browser doesn't support HTML5 tags.
- deleted 15y ago
  [deleted]
drgath 15y ago
Source: https://github.com/etianen/html5media/blob/master/src/api/html5media.js https://github.com/etianen/html5media/blob/master/src/api/ht...
fjabre 15y ago
ha! would love something like this for CSS3
uses 15y ago
To be clear, this is a fallback that uses feature detection to determine if the browser rendering the page supports the <video> or <audio> tags. If so, it leaves your tags alone. If not, it instead uses the Flash-based Flowplayer. So, you can use the <video> and <audio> tags without worrying about browser support. I've used it several times and it works well.

89 points by ryanwhitney 15y ago

Uhm, does it fallback? How much faster is it than it's competitors, seeing as it's competitors have been around much longer and have many more features?

ryanwhitney 15y ago
I've only messed around with it a bit, but yes it has flash fallback.
etianen 15y ago
html5media was actually one of the first solutions out there. It's recently been re-launched with a faster, hosted CDN. It's speed should be one of the best out there, as it's a single tiny javascript file that's heavily cached and shared between all websites.

themanr 15y ago

Looks like it requires transcoding video for Firefox support as there seems to be no way to force it to use flash in that case. Does it work with content dynamically inserted into the DOM? A quick glance at the source indicates otherwise.

etianen 15y ago
You can call html5media() at any time to kick in the fallback for any new video or audio tags that have been inserted into the DOM.

ericmoritz 15y ago

Does this act as a shim supporting the same API as the HTML5 tags?

etianen 15y ago
Unfortunately, providing the same JS media API for the Flash fallback is a massive task. There's a few solutions out there that provide a consistent API, such as mediaelement.js, but it's not the standard JS media API, and their overhead is much higher. html5media aims to be the smallest, fastest solution available. It's a little low on features, but it's great for embedding videos with an absolute minimum of fuss and effort.

5h 15y ago

Call me old fashioned, but saying "all major browsers" is one thing, yet I'd still sure like to see a list of what the author considers major...

ryanwhitney 15y ago
IE 6-9 are covered
- deleted 15y ago
  [deleted]
- cincinnatus 15y ago
  There really needs to be a detailed list in the main read me.

eekfuh 15y ago

Looks cool, but def needs some CSS additions to the play button, "cursor: pointer;" plus the other controls need the cursor property to be set to the proper thing.

etianen 15y ago
The styling of the controls are entirely at the whim of the user's browser. Unlike other players, html5media uses the native controls provided by the browser. The Firefox and Safari controls are rather sweet. The Chrome ones are a little basic at the moment.

philfreo 15y ago

Does JavaScript Audio() work also?

lautis 15y ago
No. The scope of plugin seems to be to enable audio and video tags, not to provide JS API. Html5media basically just replaces each video and audio tag with FlowPlayer (swf video/audio player) instances if browser doesn't support HTML5 tags.
deleted 15y ago
[deleted]

drgath 15y ago

Source: https://github.com/etianen/html5media/blob/master/src/api/html5media.js https://github.com/etianen/html5media/blob/master/src/api/ht...

fjabre 15y ago

ha! would love something like this for CSS3

uses 15y ago

To be clear, this is a fallback that uses feature detection to determine if the browser rendering the page supports the <video> or <audio> tags. If so, it leaves your tags alone. If not, it instead uses the Flash-based Flowplayer. So, you can use the <video> and <audio> tags without worrying about browser support. I've used it several times and it works well.