There have been some changes since the last time I tested autoplay videos. Animated GIFs have become popular, because they work on mobile. A problem is that animated GIFs can become very large. A video is typically a lot smaller. That is why Apple and Google decided to allow autoplay in their mobile browsers. But only if videos are muted
. On iOS you also have to set the playsinline
attribute, because by default videos will play fullscreen.
To get autoplay use the following setup:
<video controls autoplay loop muted playsinline>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
</video>
My tests show that the latest mobile browsers now support autoplay with the exception of MS Edge.
[update] Opera Mini on iOS 10 supports autoplay, but plays the video fullscreen. Other versions do not autoplay as one would expect from a proxy browser.
[update] Firefox on iOS does not support autoplay. This is very different from Firefox on Android that supports autoplay even with sound.
[update] On Samsung devices, the default browser is Samsung Internet. It is uses the same basis as Chrome, but it's not updated as frequently.
OS/Browser | Supports autoplay |
---|---|
iOS 9 Safari 601 | no |
iOS 10 Safari 602 | yes (with muted + playsinline attributes) |
iOS 9 Chrome 54 | no |
iOS 10 Chrome 54 | yes (with muted + playsinline attributes) |
iOS 9 Opera Mini 14 | no |
iOS 10 Opera Mini 14 | yes (plays fullscreen) |
iOS 9 Firefox 5.3 | no |
iOS 10 Firefox 5.3 | no |
Android Chrome 43 | no |
Android Chrome 54 | yes (with muted attribute) |
Android Opera Mini 20 | no |
Android Firefox 49 | yes |
Android Samsung Internet 4.0 | no |
Windows Phone 8 IEMobile 10 | no |
Windows Phone 8.1 IEMobile 11 | yes |
Windows 10 Mobile Edge 14.1 | no |
Windows 10 Mobile Opera Mini 9.1 | no |
You can test for yourselves on my autoplay test pages:
- HTML5 autoplay video muted
- HTML5 autoplay video muted + playsinline
- HTML5 autoplay video with sound + playsinline
Of course, you do not have to use autoplaying videos everywhere.