HTML JS全屏和退出全屏

全屏方法

function launchIntoFullscreen(element) {
    if(element.requestFullscreen){
        element.requestFullscreen();
    }
    else if(element.mozRequestFullScreen) {
        element.mozRequestFullScreen();
    }
    else if(element.webkitRequestFullscreen) {
        element.webkitRequestFullscreen();
    }
    else if(element.msRequestFullscreen) {
        element.msRequestFullscreen();
    }
}

退出全屏方法

function exitFullscreen() {
    if(document.exitFullscreen) {
        document.exitFullscreen();
    } else if(document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    } else if(document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
    }
}

调用代码

var divTest = document.getElementById("time");
launchIntoFullscreen(divTest);

判断全屏

错误的做法

function checkFull() {
        var isFull = document.fullscreenEnabled || window.fullScreen || document.webkitIsFullScreen || document.msFullscreenEnabled;
        //to fix : false || undefined == undefined
        if (isFull === undefined) {isFull = false;}
        return isFull;
    }

错误分析

以上代码是错的, 错的, 错的. 不晓得都哪里夏吉尔抄;
两个enabled是表示是否禁用了全屏功能, 不能作为最终的全屏与否的结果, 它只能用来提前预判是否能够使用fullScreen和webkitIsFullScreen进行全屏判断. 网上一大堆,抄来抄去的, 都没证实下的.

正确的做法

function checkFull() {
	var isFull = false;
	if (document.fullscreenEnabled || document.msFullscreenEnabled ) {
		isFull = window.fullScreen || document.webkitIsFullScreen;
        if (isFull === undefined) {
			isFull = false;
		}
	}
	return isFull;
}

PS:
经测试,在Chrome的69版本中,*document.fullscreenEnabled*和document.msFullscreenEnabled两个属性属于未定义,下面的正确做法也不适用,而上面的错误做法可行。

修改自: https://www.cnblogs.com/yiven/p/7885528.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值