Can you autoplay HTML5 videos on the iPad

Question

The  lt video gt  tags autoplay  autoplay  attribute works fine in Safari   When testing on an iPad  the video must be activated manually   I thought it was a loading issue  so I ran a loop checking for the status of the media   videoPlay  function        var me   this      console log  STATE          periscopevideo   get 0  readyState       if      periscopevideo   get 0  readyState    4         setTimeout function   me videoPlay      300             else             periscopevideo   get 0  play              The state remains at 0 on the iPad  On my desktop safari  it goes through 0  1 and finally 4   On the iPad  it only reaches 4 if I manually tap the  play  arrow   Moreover  calling     periscopevideo   get 0  play   from an click via onClick works too   Is there any restrictions by Apple in regard to autoplay   I m running iOS 5  by the way

User · Answer

Let video muted first to ensure autoplay in ios  then unmute it if you want    lt video autoplay loop muted playsinline gt     lt source src  video mp4 123  type  video mp4  gt   lt  video gt    lt script type  text javascript  gt    function        if   navigator userAgent match   iPod iPhone iPad              video   prop  muted   false            lt  script gt

User · Answer

In this Safari HTML5 reference  you can read     To prevent unsolicited downloads over cellular networks at the user   s   expense  embedded media cannot be played automatically in Safari on   iOS   the user always initiates playback  A controller is automatically   supplied on iPhone or iPod touch once playback in initiated  but for   iPad you must either set the controls attribute or provide a   controller using JavaScript

User · Answer

Just set  webView mediaPlaybackRequiresUserAction   NO   The autoplay works for me on iOS

User · Answer

iOS 10 update  The ban on autoplay has been lifted as of iOS 10 - but with some restrictions  e g  A  can be autoplayed if there is no audio track    To see a full list of these restrictions  see the official docs  https   webkit org blog 6784 new-video-policies-for-ios   iOS 9 and before  As of iOS 6 1  it is no longer possible to auto-play videos on the iPad    My assumption as to why they ve disabled the auto-play feature    Well  as many device owners have data usage bandwidth limits on their devices  I think Apple felt that the user themselves should decide when they initiate bandwidth usage     After a bit of research I found the following extract in the Apple documentation in regard to auto-play on iOS devices to confirm my assumption       Apple has made the decision to disable the automatic playing of video   on iOS devices  through both script and attribute implementations       In Safari  on iOS  for all devices  including iPad   where the user may be on a cellular network and be charged per data unit  preload and   auto-play are disabled  No data is loaded until the user initiates it   - Apple documentation    Here is a separate warning featured on the Safari HTML5 Reference page about why embedded media cannot be played in Safari on iOS      Warning  To prevent unsolicited downloads over cellular networks at   the user   s expense  embedded media cannot be played automatically in   Safari on iOS   the user always initiates playback  A controller is   automatically supplied on iPhone or iPod touch once playback in   initiated  but for iPad you must either set the controls attribute or   provide a controller using JavaScript      What this means  in terms of code  is that Javascript s play   and load   methods are inactive until the user initiates playback  unless the play   or load   method is triggered by user action  e g  a click event     Basically  a user-initiated play button works  but an onLoad  play    event does not   For example  this would play the movie     lt input type  button  value  Play  onclick  document myMovie play    gt    Whereas the following would do nothing on iOS     lt body onload  document myMovie play    gt

User · Answer

I want to start by saying by saying that I realize this question is old and already has an accepted answer  but  as an unfortunate internet user that used this question as a means to end only to be proven wrong shortly after  but not before I upset my client a little  I want to add my thoughts and suggestions   While  DSG and  Giona are correct  and there is nothing wrong with their answers  there is a creative mechanism you can employ to  get around   so to speak  this limitation  That is not say that I m condoning circumvention of this feature  quite the contrary  but just some mechanisms so that a user still  feels  as if a video or audio file is  auto playing    The quick work around is hide a video tag somewhere on the mobile page  since I built a responsive site I only do this for smaller screens  The video tag  HTML and jQuery examples    HTML   lt video id  dummyVideo  src    preload  none  width  1  height  2  gt  lt  video gt    jQuery  var  dummyVideo       lt video   gt        id   dummyVideo     src        preload   none     width   1     height   2        With that hidden on the page  when a user  clicks  to watch a movie  still user interaction  there is no way to get around that requirement  instead of navigating to a secondary watch page I load the hidden video  This mainly works because the media tag isn t really used but instead promoted to a Quicktime instance so having a visible video element isn t necessary at all  In the handler for  click   or  touchend  on mobile        movie-container   on  click   function       var url     this  data  stream-url       dummyVideo attr  src   url      dummyVideo get 0  load       required if src changed after page load    dummyVideo get 0  play          And viola  As far as UX goes  a user clicks on a video to play and Quicktime opens playing the video they chose  This remains within the limitation that videos can only be played via user action so I m not forcing data on anyone who isn t deciding to watch a video with this service  I discovered this when trying to figure out how exactly Youtube pulled this off with their mobile which is essentially some really nice Javascript page building and fancy element hiding like in the case of the video tag   tl dr Here is a somewhat  workaround  to try and create an  autoplay  UX feature on iOS devices without going above and beyond Apple s limitations and still having users decide if they want to watch a video  or audio most likey  though I ve not tested  themselves without having one just loaded without their permission   Also  to the person who commented that is from sleep fm  this still unfortunately would not have been a solution to your issues which is time based audio play back   I hope someone finds this information useful  it would have saved me a week of bad news delivery to a client that was adamant that they have this feature and I was glad to find a way to deliver it in the end   EDIT  Further finding indicate the above workaround is for iPhone iPod devices only  The iPad plays video in Safari before it s been full screened so you ll need some mechanism to resize the video on click before playing or else you ll end up with audio and no video

User · Answer

As of iOS 10  videos now can autoplay  but only of they are either muted  or have no audio track  Yay   In short     lt video autoplay gt  elements will now honor the autoplay attribute  for elements which meet the following conditions     lt video gt  elements will be allowed to autoplay without a user gesture if their source media contains no audio tracks   lt video muted gt  elements will also be allowed to autoplay without a user gesture  If a  lt video gt  element gains an audio track or becomes un-muted without a user gesture  playback will pause   lt video autoplay gt  elements will only begin playing when visible on-screen such as when they are scrolled into the viewport  made visible through CSS  and inserted into the DOM   lt video autoplay gt  elements will pause if they become non-visible  such as by being scrolled out of the viewport     More info here  https   webkit org blog 6784 new-video-policies-for-ios

[jquery] Can you autoplay HTML5 videos on the iPad?

Examples related to jquery

Examples related to ios

Examples related to objective-c

Examples related to html

Examples related to cocoa-touch