iphonevideoipadhtmlhtml5-video

HTML5 Video Not Displaying on iPad


I've encoded a few videos on http://www.theparkerpalmsprings.com to play using HTML5 when loaded via an iPhone or iPad. In my testing, everything works as expected when viewing the site on an iPhone (I've tested on a 3G and iPhone 4), but when loading on the iPad the Quicktime logo flashes quickly and then nothing happens. Is this a problem with the encoding of the videos or am I doing something else incorrectly? Any input would be greatly appreciated!

A few test links (directly to pages with video):

http://theparkerpalmsprings.com/spa/ (large video on iPad, small video on iPhone) http://theparkerpalmsprings.com/rooms/estate.php (small video for both platforms)


Solution

  • The answer was incredibly simple, which is why it was overlooked:

    The iPad requires you to include the "controls" attribute in the video tag, otherwise there's no way for it to start playback of the video, unlike on the iPhone, where a large play button appears over all HTML5 video elements. The videos were all encoded properly but this simple tag was skipped over. Hopefully this will save someone the headache it caused me.