I’m having an issue with getting a video in an iframe
to display in fullscreen on Android browsers only, as well as a problem with the video autoplaying. Here’s the snippet that I’m including in a dialog
:
<iframe width="640" height="360" src="https://player.vimeo.com/video/591370010?h=ff1a0a3c7d&title=0&byline=0&portrait=0&playsinline=0" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" mozallowfullscreen webkitallowfullscreen allowfullscreen></iframe>
I’m following MDN documentation related to the iframe
‘s allowfullscreen
property. I’ve also attempted various changes to the allowfullscreen
properties:
mozallowfullscreen="" webkitallowfullscreen="" allowfullscreen=""
mozallowfullscreen="true" webkitallowfullscreen="true" allowfullscreen="true"
None of these trigger the iframe
into fullscreen mode on Android browsers.
For the autoplay part of the issue, I’m following Vimeo’s documentation for playback on mobile by adding ?playsinline=0
to the end of the video src
param.
This code words on iOS Safari, but not in Chrome on the Galaxy S20 and Pixel 4 devices I’ve tested. Do Android browsers have an inherent bug with this?