Skip to content

Switch fullscreen iOS #3

@bertyhell

Description

@bertyhell

I found a way to switch between inline and fullscreen video on iOS since they added a playsinline attribute to safari mobile from iOS 10 and up.

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

The video would have these attributes:

<video playsinline webkit-playsinline></video>

When clicking the fullscreen button on iOS you would:

vid.removeAttribute('playsinline');
vid.removeAttribute('webkit-playsinline');
vid.play();

Then when you detect the fullscreen closing:

document.addEventListener('fullscreenchange', function() {
  if (!isFullScreen ()) {
    vid.setAttribute('playsinline', '');
    vid.setAttribute('webkit-playsinline', '');
  }
}

ios-video-fullscreen

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions