SYNCERのロゴ
アイキャッチ画像

Document.fullscreen - フルスクリーン中か?

fullscreenは、Documentのプロパティです。ドキュメントが、フルスクリーン表示中か否かを返します。このプロパティは非推奨です。代わりに、DocumentOrShadowRoot.fullscreenElementを利用して下さい。

このAPIは非推奨です。新しくコードに加えず、代わりの手段を探して下さい。

概要

名前
fullscreen
所属
Document
IDL
[LenientSetter, Unscopable] readonly attribute boolean fullscreen; // historical
仕様書
https://fullscreen.spec.whatwg.org/#dom-document-fullscreen

デモ

Document.fullscreenのデモです。フルスクリーンか否かを監視しています。セキュリティの関係で、新しいウィンドウで開かないとフルスクリーンは動作しません。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<body>
	<p><button id="request">実行</button></p>
	<p><button id="exit">解除</button></p>
<hr>
<script>
// 確認
setInterval( function () {
	// プロパティ名の統一
	if ( document.fullScreen !== undefined ) {
		document.fullscreen = document.fullScreen ;	// Firefox
	} else if ( document.mozFullScreen !== undefined ) {
		document.fullscreen = document.mozFullScreen ;	// Firefox
	}

	var value = document.fullscreen ;

	if ( lastValue !== value ) {
		console.log( value ) ;
		document.body.appendChild( new Text( value ) ) ;
	}

	lastValue = value ;
}, 100 ) ;

var lastValue = null ;

// 実行
document.getElementById( "request" ).onclick = function () {
	var element = document.documentElement ;
	element.requestFullscreen = element.requestFullscreen || element.mozRequestFullScreen || element.webkitRequestFullscreen || element.msRequestFullscreen ;
	element.requestFullscreen() ;
}

// 解除
document.getElementById( "exit" ).onclick = function () {
	document.exitFullscreen = document.exitFullscreen || document.cancelFullScreen || document.mozCancelFullScreen || document.webkitCancelFullScreen || document.msExitFullscreen ;
	document.exitFullscreen() ;
}
</script>
</body>
</html>

サポート状況

ChromeFirefoxSafariEdgeIEOperaiOS SafariAndroid
× 9+××××××
  • Twitterでシェア
  • Facebookでシェア
  • Google+でシェア
  • はてなブックマークでシェア
  • pocketに保存
  • LINEでシェア
更新履歴
2017年10月6日 (金)
コンテンツを公開しました。