Fullscreen API exitFullscreen() 方法

定義和用法

exitFullscreen() 方法在全屏模式下取消元素。

提示：請使用 requestFullscreen() 方法 以全屏模式打開元素。

實例

例子 1

以全屏模式打開 HTML 頁面，然后單擊按鈕將其關閉：

/* 獲取 documentElement (<html>) 以全屏顯示頁面 */
var elem = document.documentElement;
/* 全屏查看 */
function openFullscreen() {
  if (elem.requestFullscreen) {
    elem.requestFullscreen();
  } else if (elem.webkitRequestFullscreen) { /* Safari */
    elem.webkitRequestFullscreen();
  } else if (elem.msRequestFullscreen) { /* IE11 */
    elem.msRequestFullscreen();
  }
}
/* 關閉全屏 */
function closeFullscreen() {
  if (document.exitFullscreen) {
    document.exitFullscreen();
  } else if (document.webkitExitFullscreen) { /* Safari */
    document.webkitExitFullscreen();
  } else if (document.msExitFullscreen) { /* IE11 */
    document.msExitFullscreen();
  }
}

親自試一試

例子 2

當頁面處于全屏模式時，您可以使用 CSS 設置頁面樣式：

/* Safari */
:-webkit-full-screen {
  background-color: yellow;
}
/* IE11 */
:-ms-fullscreen {
  background-color: yellow;
}
/* 標準語法 */
:fullscreen {
  background-color: yellow;
}

親自試一試

語法

HTMLElementObject.exitFullscreen()

參數

無。

技術細節

返回值： 無返回值。

瀏覽器支持

表中的數字注明完全支持該方法的首個瀏覽器版本。

注釋：一些瀏覽器需要特定的前綴（見括號）：

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
71.0
15.0 (webkit)		 79.0
11.0 (ms)		 64.0
9.0 (moz)		 6.0 (webkit) 58.0
15.0 (webkit)