JoJo JoJo - 12 days ago 8
Javascript Question

Enable iPad Airplay on HTML5 video

I'm doing this to enable Airplay on HTML5 video for my iPad 1st generation with iOS 4.3.1.

// Prototype JS framework
$('videoContainer').appendChild(
new Element(
'video', {
id: 'video0',
src: 'http://shapeshed.com/examples/HTML5-video-element/video/320x240.m4v',
controls: 'true',
width: '200',
height: '200',
}
)
);

$('video0').writeAttribute('x-webkit-airplay', 'allow');


When I turn on airplay, all I hear is audio on the TV. How do I enable video too?

Edit:

According to Ben Dodson, you have to re-embed the video. I did this:

$('videoContainer').update($('videoContainer').innerHTML);


Is there any way around this? Seems so hacky and it's wasted processing.

Answer

Try reformatting it as a .mp4 movie, and make sure that it is H.264 video with AAC audio. It has to be H.264, or the iPad can't steam it. (Got this from http://macosrumors.com/2011/01/12/first-look-mobile-safari-airplay/)