How to bypass fullscreen playing with html5 video tag in iphone?

Question

I have a video in which I want to disable fullscreen playing with html5 video tag in iPhone,

I tried different solution as suggested in StackOverflow but none seemed to solve the problem.

Here is my solution by adding playisinline=1

<video id="orange-video-1" class="videotag active" preload="auto" playsinline=1 webkit-playsinline=1 src="emptyvideo/emptyvideo.mp4" muted>
</video>

what do I need to change to get what I want?

Answer 1

Actually you don't need to set it to equal one. playsinline should work.

Try this instead:

<video id="orange-video-1" class="videotag active" preload="auto" webkit-playsinline playsinline src="emptyvideo/emptyvideo.mp4" muted>
</video>

Doing it from a jQuery view would also work:

// Sets the attribute, empty second parameter needed
// otherwise it would be a getter func
$('video').attr('webkit-playsinline', '');
$('video').attr('playsinline', '');

// Set the webview on iOS
webview.allowsInlineMediaPlayback = true;

If that doesn't work:

Reading Apple's documentation it appears you would use the following code since playisinline=1 works if the website is stored on the home page. Try this in your config file:

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