Embedding iPhone Video

Reposting this article – and tweeting it. It was originally published on Aug 2, 2009.

Well I’ve been wanting to do this for a while so I finally sat down, googled around, looked at code, and figured out an easy way to embed iPhone video in html.

First we need to detect the iPhone’s userAgent string and redirect to another page where we will embed the video.This script should go in the head area of your code. You can redirect to any page that you want.

Next we need to embed the video along with a splash graphic when a user lands on the redirected page.

In the script you can see that I forced my image size to be 850 pixels wide. That allows the image to be large enough on the iPhone display to be seen well. Here is what the user sees on the iPhone display on the embedded video page.

There are also ways to do this via javascript, but I’ve found the embed method to be simple and straightforward.

Source Code

Sample Page (visit on your mac/pc and then your iPhone)