HTML5 Video autoplay on Mobile Browser HTML5 Video autoplay on Mobile Browser jquery jquery

HTML5 Video autoplay on Mobile Browser


Since the release of iOS 10 Apple has allowed muted video autoplay: https://webkit.org/blog/6784/new-video-policies-for-ios/

Chrome 53 on Android also allowing muted video autoplay: https://developers.google.com/web/updates/2016/07/autoplay


UPDATE - January 2017: Since this answer is still getting me rep, I strongly encourage anyone reading this to check out the answer from Rihards and give it some love. Rihards' references are more modern than this answer and should help if you need auto-play in browser.


The auto play limitation in mobile browsers is an intentional limitation put in by the OS developers. To my knowledge, there is absolutely no way to auto play content in a mobile browser because the event that is required to trigger content play is an OS/Phone event, one which the browser itself has no control over or interaction with.

Facebook has implemented a video auto play feature to its advertising arsenal, but this is only through its native app. Even the mighty FB must surrender its will to the power of the phone gods.

I found one article about this new FB ad presentation technique that had some users in the comments section complaining about a way to disable autoplay in browsers like you can with the native FB app:

Facebook to Add Auto-Play Video to NewsFeed for All Mobile Users

But this is obviously a hypothetical complaint and banter because the comments were made prior to FB fully launching that feature.

My conclusion: If you absolutely need auto play, you are going to have to go "native" (ha... see what I did there?).


I was having issues when autoplaying videos on iOS 11. Android and iOS 10.3 worked fine with a solution equal to those provided by Pointi and Rihards.

The Mobile Safari on iOS 11 seems to be a little more of a diva again. Please make sure to add the prefixed attribute (webkit-playsinline) as well.

<video playsinline webkit-playsinline autoplay muted loop>  <source src="./video.mp4" type="video/mp4"></video>

This solution works in every popular desktop-browsers as well as on Android Chrome and iOS 10/11 Safari/Chrome. It even works in most Inline-Browsers as for example in the Facebook-App (tested on iOS 11).

Finding this out cost me hours, so I hope I can be a help at least for you.