CODEWITHSUNDEEP
iphoneipadhtmliosmobile-safari
David Gouldin
David Gouldin

Reputation: 575

How can I autoplay media in iOS >= 4.2.1 Mobile Safari?

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?

Upvotes: 23

Views: 37650

Answers (9)

Michael Johnston
Michael Johnston

Reputation: 61

As others have said here and according to Apple documentation, MobileSafari does NOT support the autoplay attribute in the video tag. However, in iOS 6 it DOES work. This appears to be a bug which Apple fixed in iOS 6.0.1 (and presumably in iOS 6.1).

Don't rely on autoplay working in iOS 6 if you happened to stumble across it working in iOS 6.0.

-Michael

Upvotes: 6

dkurland
dkurland

Reputation: 21

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.

Upvotes: 0

Jeremiah Isaacson
Jeremiah Isaacson

Reputation: 340

Autoplay is supported (in my tests) with an iPhone 5 (iOS 6) using the headphone jack.

Upvotes: 0

Ahammad Firoj
Ahammad Firoj

Reputation: 11

Please Try this Code it is working both version, you need to add the audio control dynamically in page. it is working.

var isiPad = false;
if (navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i)) { 
    isiPad = true; 
}
$(function() { 
    if (isiPad) { 
        var audioElement2 = document.createElement('audio'); 
        audioElement2.setAttribute('src', 'img/bgsound.mp3'); 
        audioElement2.controls = true; 
        audioElement2.loop = true; 
        audioElement2.load();
        audioElement2.play();
    }
});

Upvotes: -1

mousedown
mousedown

Reputation: 165

How about this?

Create an audio sprite with Sound Manager 2, preload & cache it from the first user interaction, and then play as and when needed.

Would that work?

Upvotes: 1

bhups
bhups

Reputation: 14895

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);

Upvotes: 14

steve
steve

Reputation: 11

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...

Upvotes: 1

Yu Jianrong
Yu Jianrong

Reputation: 322

Starting from iOS 4.2.x, the download of media will not be started if there isn’t a user-input event, like touchstart.

So the answer is no, there is no method to autoplay media by JavaScript or something else.

Upvotes: 16

mshafrir
mshafrir

Reputation: 5230

As a workaround, I tried tying the load()/play() code to a click event, and then triggering the click event programmatically. This approach worked in Desktop Safari, but not Mobile Safari.

Upvotes: 4

Related Questions