Fullscreen mode for embedded video in iframe which is embedded in another iframe

Question

Is it possible to enable fullscreen mode for a video embedded in an iframe that is also part of another iframe?

As an example:

...
<body>
...
  <iframe id="video1" src="..." allowfullscreen></iframe> <!-- Full screen mode works -->
  <iframe id="comments" src="..." allow="fullscreen" allowfullscreen>
    #document
    ...
    <iframe id="video2" src="..." allowfullscreen></iframe> <!-- Full screen mode does not work -->
  </iframe>
...
</body>
...

Koustav Kumar Das · Accepted Answer · 2024-11-15 13:06:34Z

1

Like in the provided code sample, we can see Parent iFrame and Child iFrame both are having the attribute "allowfullscreen".

  <iframe id="comments" src="..." allowfullscreen>
    <iframe id="video2" src="..." allowfullscreen></iframe> <!-- Full screen mode does not work -->
  </iframe>

As per the Permission Policy Header we should use allow="fullscreen" instead of using allowfullscreen. Please refer the updated code below.

<iframe id="comments" src="..." allow="fullscreen">
    <iframe id="video2" src="..." allowfullscreen></iframe> <!-- Full screen mode does not work -->
  </iframe>

This solution worked for me, else there might be some Cross-Origin Restrictions from the iFrame you're embedding.

answered Nov 15, 2024 at 13:06

Koustav Kumar Das

113 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Corhal Over a year ago

Unfortunately, it doesn't work for me. And I can't figure out why. I even tried with two attributes: allow="fullscreen" and allowfullscreen (on the principle of "more - not less"), but switching to full mode for video still doesn't work.

Collectives™ on Stack Overflow

Fullscreen mode for embedded video in iframe which is embedded in another iframe

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related