2

I am using iframe to play youtube video. It display full screen icon but on click it says 'fullscreen is unavailable'. I am using allfullscreen still it is not working. Below is the code I have tried so far.

Code 1.

<iframe width="760" height="415" id={showVid.id} title={showVid.title} src={showVid.link} allowfullscreen allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"></iframe>

Code 2.

<iframe width="760" height="415" id={showVid.id} title={showVid.title} src={showVid.link} allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture fullscreen"></iframe>
Anurag Srivastava
  • 14,077
  • 4
  • 33
  • 43
nothing
  • 29
  • 1
  • 5

3 Answers3

2

Depending on which browser you are using you may need alternative settings turned on iframe see: YouTube iframe embed - full screen for in depth answer

HugoDos
  • 291
  • 2
  • 9
1

Make sure you are using https in the src attribute for youtube, e.g.

<iframe allow="fullscreen;" src="https://www.youtube.com/embed/{video.id}"></iframe>

I was developing locally using a "//www.youtube.com" link and fullscreen would never work for me!

-1

iframe{
 width : 100%
}
then using javascript api set the zoom attribute to zoom = 1;