Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
JavaScriptからフルスクリーン化
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScriptからフルスクリーン化</title>
<style type="text/css">
body {
background-color: #888888;
}
:-webkit-full-screen #isFullscreen{
}
:-webkit-full-screen #isFullscreen:after {
content: 'にしました'
}
:-moz-full-screen #isFullscreen{
}
:-moz-full-screen #isFullscreen:after {
content: 'にしました'
}
</style>
<script type="text/javascript">
window.addEventListener('load', function() {
var element = document.getElementById('fullscreenBtn');
if(element) {
element.addEventListener('click', function(e) {
// webkit
if(document.body.webkitRequestFullScreen) {
document.body.onwebkitfullscreenchange = function(e) {
document.body.style.width = window.innerWidth + 'px';
document.body.style.height = window.innerHeight + 'px';
document.body.onwebkitfullscreenchange = function() {
};
};
document.body.webkitRequestFullScreen();
}
// mozilla
if(document.body.mozRequestFullScreen) {
document.body.mozRequestFullScreen();
}
e.preventDefault();
}, false);
}
});
</script>
</head>
<body>
<h1>JavaScriptからフルスクリーン化</h1>
<h2 id="isFullscreen">フルスクリーンモード</h2>
<p>
<a href="#" id="fullscreenBtn">フルスクリーンにする</a>
</p>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.