<video> and <audio> support on My Opera

November 7, 2011 · by Aleksander Aas

<video> and <audio> is now fully supported on My Opera! This allows us to share this week's Opera Tech Break video proper using HTML5. To learn more more about HTML5, check out our Dev.Opera article on the subject.

The video above was embeded using the following code:

<video width="620" height="360" controls="controls">
   <source src="http://people.opera.com/espenao/movie/techbreak-html5.mp4" type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"'/>
   <source src="http://people.opera.com/espenao/movie/techbreak-html5.ogv" type='video/ogg; codecs="theora, vorbis"'/>
   <source src="http://people.opera.com/espenao/movie/techbreak-html5.webm" type='video/webm; codecs="vp8.0, vorbis"'/>
<p>You don't have support for HTML5 video!</p>
<p><a href="http://www.opera.com/">Download Opera to get it! :)</a></p>
</video>

As you can see, we have fall back solutions in three formats; mp4, Ogg and WebM.

To add some audio try the following code:

<audio controls="" preload="" src="http://files.myopera.com/zoso/files/01-allthelivingandthedead-IntheMoon.ogg" >
<p>You don't have support for HTML5 audio!</p>
<p><a href="http://www.opera.com/">Download Opera to get it! :)</a></p>
</audio>

Have fun! Let us know how it goes!

Readers' comments 24

Left under the original article, as archived.

ouzowtfMonday, November 7, 2011 8:08:19 PM
Nice, but there is no picture of the video until you start it, only a black video screen. Is this intentionally?
And there is still no visual preload status of HTML5 video in Opera, correct?
DeyanMonday, November 7, 2011 8:15:48 PM
It goes fast [!] with forward slider, but what about fullscreen mode?
praetor87Monday, November 7, 2011 8:16:33 PM
The World is just become harder for IE users (at work).
АндрейMonday, November 7, 2011 8:35:52 PM
Nicky LakyMonday, November 7, 2011 8:42:32 PM
...where do i have to add that codes...?
JoelMonday, November 7, 2011 11:58:32 PM
Awesome! is a pretty cool feature for ours blogs, now I'll can say to flash player
BugfixerTuesday, November 8, 2011 12:45:14 AM
I think my PC is too slow for WebM video. The sound plays but the picture doesn't move forward.

Athlon XP 2800+
nforce 2 chipset
1GB DDR RAM
Geforce 7600GS Sonic - driver version 285.62

What's the minimal hardware requirement for WebM video? Does it work better on my PC with a hardware accelerated version of Opera? I can't test it with HAW because the latest version of Opera 12.00 crashes when i try to start Opera since the newest driver version of my graphic card.
DanielTuesday, November 8, 2011 1:07:32 AM
Yeah
I'm working on this for my site too!
Patrick O'ReillyTuesday, November 8, 2011 2:44:35 AM
Thanks for adding this, being the original complainant it's good to see such a fast turnaround on the fix.
Charles SchlossTuesday, November 8, 2011 4:38:17 AM
http://files.myopera.com/Tamil/Smilies/ThumbsUp.gif - Yea easier to post video links
Ayesh IceTuesday, November 8, 2011 7:11:34 AM
i will try wait. Sound is cool
Aleksander AasTuesday, November 8, 2011 8:56:26 AM
Originally posted by paddy2k:

Thanks for adding this, being the original complainant it's good to see such a fast turnaround on the fix.

We aim to please
Satan D. LuciferTuesday, November 8, 2011 11:02:43 AM
i just tried this in 11.60 build 1134(windows)

its smooth and there is no lag or buffering(like flash videos)
keep up the good work opera team
techlawsamTuesday, November 8, 2011 2:51:46 PM
choppy on opera 11.60 build 1144 Beta RC on Windows 8 32 bit, but probably is expected..other than that great work I like that My Opera is going HTML5!
Ismael M.Tuesday, November 8, 2011 3:44:10 PM
HTML5 without subtitles
United States of EuropeTuesday, November 8, 2011 11:31:43 PM
No indication of downloaded amount of video data is provided. I guess lacks in the data caused stopping of the video, but can't say for sure - I just didn't knew how much of the file was ready to be played.

Irritating way of handling situation when not whole video is yet downloaded - it is starting to play again too often instead of waiting for safer amount of data to start playing again later, but with no more stops, if connection quality would stay the same.

Delay demanded will vary across sites, automatic method may be disputable, option would be nice, but it's standards matter...
KamaleshWednesday, November 9, 2011 6:40:08 AM
HTML5 video, excellent!

As @Deyan said...please add <param name="allowFullScreen"...
Stoyan PomakovThursday, November 10, 2011 4:18:01 PM
Good!
Dustin WilsonThursday, November 10, 2011 11:57:38 PM
What about storage? We can't store video files on My Opera can we?
Patrick O'ReillyFriday, November 11, 2011 9:35:16 AM
MyOpera File's specifically exclude video files.
However Dropbox don't
Ab.Razaque.keerioSunday, November 13, 2011 5:16:07 AM
very Good...
Dan AlexandruSunday, November 13, 2011 7:08:41 AM
Thanks!

One small nitpick: the syntax has to be valid xhtml.

While the community content is currently HTML5, the code < video controls > isn't currently recognized, so indeed MyO requires < video controls="controls" >. Also, not closing the source tags mangles the post in both RSS and Atom blog feeds (Google Reader reports an error only behind the scenes, and the post & video render ok); notice the auto-closing of the last source tag:
```
<content xml:lang="en" type="xhtml">
<div xmlns="http://www.w3.org/1999/xhtml" lang="en" dir="ltr">
<video width="480" height="360" controls="controls" poster="…">

<source src="…" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'" />
<source src="…" type="video/webm; codecs='vp8, vorbis'" />
<source src="…" type="video/ogg; codecs='theora, vorbis'">
<p>…</p>
</source>

</video>
</div>
</content>
```
Talibi OluwadareSunday, November 13, 2011 7:32:14 PM
Opera
Ab.Razaque.keerioSunday, November 27, 2011 4:13:45 AM