HTML5 <video> element on Android does not play

Question

Video tags like below plays fine with iPhone, but not Android:

<video id="video" width="320" height="240" poster="video/placeholder.jpg" autobuffer controls>
  <source src="pr6.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
  <source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"'>
</video>

With the above code, Android can't even click the clip. It would just see the poster image.

Video tag like below however works with Android:

<video src="vpr6.mp4" poster="video/placeholder.jpg" onclick="this.play();"/>

However, I still need to multiple sources capability (for Firefox ogv support…). Below code does not work (nor do they work if I stick the javascript into the source tags):

<video id="video" width="320" height="240" autobuffer controls onclick="this.play();">
  <source src="pr6.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
  <source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"'>
</video>

With above code, the clip is clickable in Android, but still does nothing.

Can anyone help?

Is this a native or a webpage? If native, have you enabled Javascript for your Webview? — Pentium10
just a webpage I'm trying to setup so that multiple browsers can play the video correctly. — T1000

Artiom Chilaru Artiom Chilaru · Accepted Answer · 2010-05-26T08:53:37

Try to remove the codecs from the source listings.. It might be that the codecs you're listing are not present on Android, so it's choking.

If you use the src attribute, it'll auto-detect the codec, so it's using something else :)

HTML5 <video> element on Android does not play

1 Answers