How do I avoid the auto fullscreen video player on iOS?

I've made a C2 page included a mp4 film by using Video plugin, when I watch it in iOS Safari or Weixin browser, the video player pops up and takes over the screen.

I found an answer from google said <video id="myVideo" width="xxx" height="yyy" webkit-playsinline> can stop the auto fullscreen, but how do I add the code to the video plugin?

Any suggestions for me?

did you ever find a solution to this, been trying to figure this out myself

You can't avoid it. iOS is specifically designed to do this for all video playback. The video plugin also already applies webkit-playsinline - this allows inline playback on iPads, but not iPhones. I've looked and there's no workaround for iPhones! This appears to be a deliberate decision by Apple.

IOS 10 now supports playing video inline, on iPhone. The changes also incorporate auto-playing video without user interaction (muted videos only).

https://webkit.org/blog/6784/new-video- ... s-for-ios/

Plus, there is support for painting a video onto canvas, so potentially allowing background video in construct 2 on IOS!

"These new policies mean that more advanced uses of the <video> element are now possible, such as painting a playing <video> to a <canvas> without taking that <video> into fullscreen mode."

Someones cooked up a polyfill for IOS 8 and 9 as well:

https://github.com/bfred-it/iphone-inline-video

Would love to see this in construct 2, recently used inline play for IOS 10 on a none construct 2 html5 app and it works great, not sure if it has moved to construct 2 yet but these features would be an awesome addition.

I have just tested out playing inline videos again but not using wkebview and webkit-playsinline no longer works i believe (ipad iOS 10).

The video plays inside a player on ipad in landscape instead of inline as it should. Can someone else please test this. the webkit-playsinline tag has been deprecated so now the tag is playsinline as apposed to webkit-playsinline. any chance this can be added to a beta because i need my videos to play inline as they did in iOS 9 on ipad and overlay sprites on top.

Hi

I've got inline video working on iPhone ios 10 and iPad mini ios 9 (Cordova/PhoneGap).

I had to edit the default construct 2 video plugin: C:\Program Files\Construct 2\exporters\html5\plugins\video\runtime.js

Look for this.video.setAttribute("webkit-playsinline", "");

And beneath it add: this.video.setAttribute("playsinline", "");

Then, move both lines out of the if statement "if (this.useDom)" - put them above it. This is because ios 9/10 is now drawing the video to the canvas rather than using the dom. This means that you can now add objects on top of the video as it is being drawn on the canvas itself.

To make this work on Cordova I also had to add this setting to config.xml:

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

I'm having the same issues exporting to xcode. Its been one of those issues for me thats been hard to pin down

Salvo776 - please stop bumping old, unrelated threads with links to your thread. Closing this thread.