How can I autoplay media in iOS >= 4.2.1 Mobile Sa

Question

I cannot seem to get audio media to play in Mobile Safari on iOS 4.2.1 in any situation other than the handler of a click event performed by the user. Even then, if player.play() is called in any asynchronous fashion (ajax, setTimeout, etc) it doesn't work.

I've tried calling player.load() before player.play(). I've tried triggering a click event on a dom element whose handler calls player.play(). I've tried using both audio and video tags.

All the loopholes that worked prior to iOS 4.2.1 seem to be closed. Any ideas?

Answer 1

On my 3rd-gen iPad running IOS 6, autoplay of HTML5 tags has suddenly begun working! (I've had IOS 6 installed for a couple of weeks, and am pretty sure I tested this feature right away, but only noticed it working tonight.) I don't recall seeing any notice of this from Apple, although I did see that mobile Safari had been granted the ability to support file uploads via

<form><input type="file" .../></form>

-- another feature I needed but which Apple had withheld.

Answer 2

This worked on the iPad until last nights 4.2 upgrade:

$(function() {
    var Beep = document.createElement('audio');
    Beep.setAttribute('src', 'beep-23.mp3');
    Beep.load();
    Beep.play();
}

My Beep.play(); still works for a click event, but the initial Beep.play() stopped working...

Answer 3

There is one way to play the video/audio file automatically on 4.2.1. Create an iframe and set its source to the media file's URL and append the iframe to the body. It'll be autoplay.

var ifr=document.createElement("iframe");
ifr.setAttribute('src', "http://mysite.com/myvideo.mp4");
ifr.setAttribute('width', '1px');
ifr.setAttribute('height', '1px');
ifr.setAttribute('scrolling', 'no');
ifr.style.border="0px";
document.body.appendChild(ifr);