HTML5 Video Fullscreen not working on iPad

Question

I have an html5 video stream. I use custom controls, and bind actions to them using jQuery. One of these said controls is a fullscreen button, which calls video.webkitEnterFullScreen(). When i test this out in Safari fullscreen works fine. When I try this on an iPad it fails. What gives?

Here is how i declare my video in html:

<video preload="true" width="720" height="405"></video>

Here is the declaration of my fullscreen button:

<a href="javascript:;" class="fullscreen">
     <span class="icon"></span>
</a>

Here is how I bind the button to the action:

var video = $('video')[0];
$('body').find('.fullscreen').click(function(){
     video.webkitEnterFullscreen();
});

$('body').find('.fullscreen .icon').click(function(){
     video.webkitEnterFullscreen();
});

Again this works in safari but not on the ipad. When include alerts and logging statements into the function declaration they appear, meaning that my clicks did register with the ipad, but the video does not go into fullscreen mode. Help!

UPDATE: Just to clarify my issue, i am not having trouble with playback. The video plays in both safari desktop and safari for the ipad. On safari for the desktop, fullscreen works, but on safari for the ipad fullscreen does not work.

Answer 1

Bad news sorry... So far webkitEnterFullscreen is not supported by iPad. Good news is specs has been draft here: http://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html

We will need to wait little bit more for that to happen...