Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Microscopic Javascript fullscreen controller
// Fullscreen controller used on www.windy.com
const d = document
, el = $('#fullscreen')
, isFullscreen = () => d.fullscreen || d.webkitIsFullScreen || d.mozFullScreen
, onFullChange = () => el.innerHTML = isFullscreen() ? '' : '-' // Change of icon
d.addEventListener('fullscreenchange', onFullChange )
d.addEventListener('webkitfullscreenchange',onFullChange )
d.addEventListener('webkitfullscreenchange',onFullChange )
d.addEventListener('mozfullscreenchange',onFullChange )
d.addEventListener('MSFullscreenChange',onFullChange )
el.onclick = toggleFullscreen
function toggleFullscreen() {
var elem = document.body
if( isFullscreen() ) {
if( d.exitFullscreen) d.exitFullscreen()
else if( d.webkitExitFullscreen) d.webkitExitFullscreen()
else if( d.webkitCancelFullScreen) d.webkitCancelFullScreen()
else if( d.mozCancelFullScreen) d.mozCancelFullScreen()
else if( d.msExitFullscreen) d.msExitFullscreen()
} else {
if (elem.requestFullscreen) elem.requestFullscreen();
else if (elem.msRequestFullscreen) elem.msRequestFullscreen();
else if (elem.mozRequestFullScreen) elem.mozRequestFullScreen();
else if (elem.webkitRequestFullscreen) elem.webkitRequestFullscreen();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment