HTML5 video on iPad

Question

I have a dynamic video gallery and it works great on a computer. When moving to an iPad, the video starts loading and it shows the cannot play icon. Instead of this I\'d r

Answer 1

Check to see if the browser can play the video before you attempt to load it:

function canPlayVorbis() {
    var v = document.createElement('video');
    return !!(v.canPlayType && v.canPlayType('video/ogg; codecs="theora, vorbis"').replace(/no/, ''));
}

function canPlayMP4() {
    var v = document.createElement('video');
    return !!(v.canPlayType && v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"').replace(/no/, ''));
}

function canPlayWebM() {
    var v = document.createElement('video');
    return !!(v.canPlayType && v.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/no/, ''));
}

Taken from Dive Into HTML5 Appendix A.

Answer 2

Here's a GREAT place to get familiar with HTML5 events.

http://www.w3.org/2010/05/video/mediaevents.html