How to make video iPad, iPhone and iPod touch compatible with JavaScript, Flowplayer & HTML5–Internet–Tools & Tips for Multimedia Designers–Planet of the Web
Making your website video iPad friendly with JavaScript and HTML5
The iPad is a great device to watch video. According to newteevee.com, iPad users watch 3 times as much video as regular web users.
I can attest to that, I’d much rather watch movies on my iPad than on my iPhone, my laptop or…gasp…my TV. It’ also a great way to enjoy web tutorials since it frees your laptop’s screen to completely follow along with a tutorial.
Unfortunatelly, the excellent flowplayer, the video player I’m currently using, is a flash based player and Steve Jobs is not having any of that on his iPad. HTML5 is a good solution, but managing between the Flowplayer and HTML5 takes a bit of wrangling.
You might be thinking that it would be great to just use HTML5 for all of the videos, but it’s not supported by Internet Explorer 8, so until that happens we need a workaround. Luckily FlowPlayer can work in any browser as long as it has a flash plug-in, which means we can use it for everything except for Apple’s Mobile Devices and take care of those using HTML5. If you’re interested in HTML5, check out the excellent guide by Mark Pilgrim.
In the meantime you can use this technique to make sure your video plays on the iPad, the iPhone, and the iPod Touch, as well as in other browsers.