Javascriptで全画面(フルスクリーン)表示させる

javascriptでelement.requestFullscreen()メソッドで全画面表示、document.exitFullscreen()で全画面表示を終了できます。

全画面表示の例

document全体を全画面表示することができます。

<a onclick="toggleFullScreen(document.documentElement);">全画面表示と全画面終了</a>
<script>
  function toggleFullScreen(obj){
    if(!document.fullscreenElement){
      obj.requestFullscreen();
    }else{
      document.exitFullscreen();
    }
  }
</script>

指定エレメントのみの全画面表示の例

指定のエレメントのみ全画面表示させることもできます

全画面表示と全画面終了

<div id="fullscreen_element" style="background:#fff;">
  <a class="bt102" onclick="toggleFullScreen(document.querySelector('#fullscreen_element'));">
    <span>全画面表示と全画面終了</span>
  </a>
</div>
<script>
  function toggleFullScreen(obj){
    if(!document.fullscreenElement){
      obj.requestFullscreen();
    }else{
      document.exitFullscreen();
    }
  }
</script>