Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

webkit-playsinline stops working when returning to page in cordova iOS app

I have an inline video embedded in the home page of a cordova (phonegap) app for iOS. I have added the necessary allow setting to the config.xml

<preference name="AllowInlineMediaPlayback" value="true" />

and the the video html looks like this

<video webkit-playsinline poster="img/videoplaceholder.png" loop class="video" autoplay="autoplay">
    <source src="media/homepage.iphone.mp4"/>
</video>

When the app first launches the video plays inline and works perfectly. But if I navigate away from the homepage and then return, the video opens full screen on page load. I have tried moving the video lower in the page to test if it was because the browser was focusing on page load. I have also tried removing autoplay and delay triggering play with JS. I have tested all of the above in iOS7 and iOS8 only as those are my targeted versions. Any suggestion?

Thank you in advance.

like image 370
kai Taylor Avatar asked Sep 05 '25 18:09

kai Taylor


1 Answers

You need to add 'allowinlinemediaplayback=YES' to your first window.open call. So that it looks something like this:

window.open('http://google.com', 'Google', 'location=0,status=0,allowinlinemediaplayback=YES');

InAppBrowser defaults your allowinlinemediaplayback setting to NO, for some silly reason.

like image 171
Zyph Avatar answered Sep 08 '25 07:09

Zyph