okumurakengo/index.html

## index.html
<!DOCTYPE html>
<meta charset="UTF-8">
<title>Document</title>
<style>
#my-text {
    color: #faa;
}
#my-text:fullscreen {
    color: #afa;
}
::backdrop {
    background: rgb(111, 150, 255);
}
</style>

<button
  onclick="activateFullscreen(document.getElementById('my-text'));"
>
  Fullscreen #my-text!
</button>
<div id="my-text">
    <h1>Hello world</h1>
    <span>Lorem ipsum dolor sit amet.</span>
</div>

<script>
function activateFullscreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();        // W3C spec
  }
  else if (element.mozRequestFullScreen) {
    element.mozRequestFullScreen();     // Firefox
  }
  else if (element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();  // Safari
  }
  else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();      // IE/Edge
  }
};
</script>
	<!DOCTYPE html>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
	#my-text {
	color: #faa;
	}
	#my-text:fullscreen {
	color: #afa;
	}
	::backdrop {
	background: rgb(111, 150, 255);
	}
	</style>

	<button
	onclick="activateFullscreen(document.getElementById('my-text'));"
	>
	Fullscreen #my-text!
	</button>
	<div id="my-text">
	<h1>Hello world</h1>
	<span>Lorem ipsum dolor sit amet.</span>
	</div>

	<script>
	function activateFullscreen(element) {
	if(element.requestFullscreen) {
	element.requestFullscreen(); // W3C spec
	}
	else if (element.mozRequestFullScreen) {
	element.mozRequestFullScreen(); // Firefox
	}
	else if (element.webkitRequestFullscreen) {
	element.webkitRequestFullscreen(); // Safari
	}
	else if(element.msRequestFullscreen) {
	element.msRequestFullscreen(); // IE/Edge
	}
	};
	</script>