allowfullscreen

an HTML attribute for the iframe tag
  1. Welcome
  2. Examples
    1. CSS
    2. iframe
    3. React
    4. Vimeo
    5. YouTube
  3. Errors
  4. Anecdotes

Links

  1. querySelectorAll()
  2. Examples Network
  3. Questions LLC

Examples


HTML Code for iframe With allowfullscreen Attribute

The following HTML code is used to embed a YouTube video into a webpage:

<iframe width="560" height="315" src="//www.youtube.com/embed/9bZkp7q19f0" allowfullscreen></iframe>

Here is what the code looks like when displayed to a user. Once the video is played, a fullscreen button is displayed in the bottom-right hand corner:


HTML Code for iframe Without allowfullscreen Attribute

Conversely, here is the same HTML code without the allowfullscreen attribute:

<iframe width="560" height="315" src="//www.youtube.com/embed/9bZkp7q19f0"></iframe>

As before, here is what the code looks like when displayed to a user. At the time of this writing, you will notice that once the video is played, the fullscreen button is still displayed in the bottom-right hand corner. However, YouTube often makes changes to the default behavior of embedded videos. It is not safe to assume that the fullscreen button will appear by default without the allowfullscreen attribute.