Force iOS iPhone youtube embed player out of fullscreen

Question

I am creating a website where a user watches a video, and answers questions along the way. However, I am having one problem. When a user watches the YouTube embeded video on an iPhone, it launches in the iOS player, not the YouTube player. When I attempt to take the player out of fullscreen, instead of doing it, it pauses the video and just sits there. I am using this code:

if (
    document.fullscreenElement ||
    document.webkitFullscreenElement ||
    document.mozFullScreenElement ||
    document.msFullscreenElement
) {
    // exit full-screen
    if (document.exitFullscreen) {
        document.exitFullscreen();
    } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
    }
}

This works on everything EXCEPT the iOS iPhone player. I have tried hiding the player as well, but that doesn't work either. Is there a way to get the player out of fullscreen, or some kind of workaround? Thank you!

NOTE: I am using the Youtube iframe API. https://developers.google.com/youtube/iframe_api_reference?hl=en

Answer 1

I use the following code as a workaround:

When you want to exit the iPhone player:

player.seekTo(2000, true);

This will make the player go to the end of the video and close the fullscreen player.

Answer 2

On Iphone videos plays in Apples own video player. This player is not a html5 element as YouTubes player is. Hence there is no element in Fullscreen on Iphone.

This is not the case on for example Ipad, where YouTubes own player kicks in, enabling the fullscreenmode.

In short: I'm quite sure you can't do this. (Happily proven wrong)

Answer 3

This is impossible. Either you make it switch to the YouTube App, or you use the iOS default player Inside your app.