原生JS中关于全屏显示的各个操作

设置全屏显示与退出全屏显示

function toggle_full_screen(){
	if(document.fullscreenElement ||
	   document.mozFullScreenElement ||
	   document.webkitFullscreenElement ||
	   document.msFullscreenElement){
	    if (document.exitFullscreen) {
	        document.exitFullscreen();
	    } else if (document.mozCancelFullScreen) {
	        document.mozCancelFullScreen();
	    } else if (document.webkitExitFullscreen) {
	        document.webkitExitFullscreen();
	    } else if (document.msExitFullscreen) {
	        document.msExitFullscreen();
	    }
	}else{
	    if (document.documentElement.requestFullscreen) {
	        document.documentElement.requestFullscreen();
	    } else if (document.documentElement.mozRequestFullScreen) {
	        document.documentElement.mozRequestFullScreen();
	    } else if (document.documentElement.webkitRequestFullscreen) {
	        document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
	    } else if (document.body.msRequestFullscreen) {
	        document.body.msRequestFullscreen();
	    }
	}
}

判断是否为全屏显示

function is_full_screen(){
    return document.documentElement.clientHeight===window.screen.height;
}

监听是否全屏

var IS_FULL_SCREEN = is_full_screen();
window.onresize = function() {
	IS_FULL_SCREEN = is_full_screen();
}

 

你可能感兴趣的:(web)