“webkit-playsinline” video tag attribute

Question

The tag attribute webkit-playsinline supposedly prevents the default go to fullscreen behavior of HTML5 videos.

I added thi

Answer 1

The webkit-playsinline attribute works for HTML5 video on iOS4+ but only when you save the webpage to your home screen as a webapp. If you are using mobile Safari it will always open fullscreen.

Theres a small blurb about its support here: http://developer.apple.com/library/ios/#documentation/uikit/reference/UIWebView_Class/Reference/Reference.html

I've also seen on recent versions of Android that inline video playback does work within its native browser.

Answer 2

This worked for me. I tried to use playsinline inside of video tag. But it didn't work so I tried to set attribute from jQuery

$('#you video tag id').attr('playsinline',''); 

Answer 3

Apple has finally enabled the playsinline attribute on iOS 10, so this will work:

<video src="file.mp4" playsinline>

I wrote a polyfill called iphone-inline-video that adds the same behavior to iOS 8 and 9.

Answer 4

Looks like this might finally get implemented properly in iOS 10