Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disable auto fullscreen of YouTube embeds on iPhone

As we will know from other questions on the site to in iOS Mobile Safari we have these tasty attributes webkit-playesinline and the more concise playsinline to disable auto fullscreen of videos.

Despite that miracle I'm still unable to figure out how to add this to YouTube html5 embeds. As expected the YouTube <video> is contained within an <iframe>.

the ideal result is something as the following:

<video 
    tabindex="-1" 
    class="video-stream html5-main-video" 
    style="width: 736px; height: 414px; left: 85px; top: 0px;" 
    src="blob:https://www.youtube.com/6889sdad6d2-ec51-49ca-b357-a5bd9c3ede71" 
    webkit-playsinline="true" 
    playsinline="true">
</video>

I have tried, in vain, to do this via jquery.

Any thoughts or ideas how to do this?

like image 603
David Avatar asked Dec 04 '16 16:12

David


People also ask

How do you stop Youtube from going full screen on Iphone?

Exit full screen Tap the video. At the bottom of the video player, tap full screen exit or swipe down on the video.

How do I stop Youtube from auto full screen?

Method 1 of 5: If this is the reason you're encountering a full-screen error, pressing the F5 key or clicking the "Refresh" button will reload the YouTube page and fix the problem.

How do I get an embed code from youtube on my Iphone?

Locate the video you wish to use and click on the Share link located beneath the video. 2. Next, click on the Embed icon The embed code will then be displayed. Copy and paste the embed code into your course.


1 Answers

Add playsinline=1 paramerer to the embed url. Add ? or & before as appropriate; ? if the only paramerter, & to concatenate with other params.

Example:

<iframe
  src="https://www.youtube.com/v/VIDEO_ID?playsinline=1">
</iframe>

From YouTube iFrame Player API:

This parameter controls whether videos play inline or fullscreen in an HTML5 player on iOS. Valid values are: 0: This value causes fullscreen playback. This is currently the default value, though the default is subject to change. 1: This value causes inline playback for UIWebViews created with the allowsInlineMediaPlayback property set to TRUE.

like image 126
David Avatar answered Sep 22 '22 01:09

David