木子屋 Dnawo's BLOG

H5实现页面全屏显示脚本

👤 dnawo 📅 2022-12-30 👁 2475 👍 0 💬 0 🔄 来源:本站原创
1、页面开启全屏

function openFullScreen() {
	var doc = document.documentElement;
	if (doc.requestFullscreen) {
		doc.requestFullscreen();
	} else if (doc.msRequestFullscreen) {
		doc.msRequestFullscreen(); //早期IE浏览器
	} else if (doc.webkitRequestFullScreen) {
		doc.webkitRequestFullScreen(); //早期Chrome浏览器
	} else if (doc.mozRequestFullScreen) {
		doc.mozRequestFullScreen();  //早期火狐浏览器
	}
}

2、页面退出全屏

function exitFullScreen() {
	var doc = document;
	if(doc.exitFullscreen) {
		doc.exitFullscreen();
	} else if(doc.msExitFullscreen) {
		doc.msExitFullscreen(); //早期IE浏览器
	} else if(doc.webkitExitFullscreen) {
		doc.webkitExitFullscreen(); //早期Chrome浏览器
	} else if(doc.mozCancelFullScreen) {
		doc.mozCancelFullScreen(); //早期火狐浏览器
	}
}

3、判断页面全屏状态

function isFullScreen(){
	return !!(document.fullscreenElement || document.msFullScreenElement || document.webkitFullScreenElement || document.mozFullScreenElement);
}

评论(0)

暂无评论。

验证码
评论需审核通过后显示
← 上一篇 H5监听移动设备摇一摇功能实现[转] 下一篇 → 无创DNA和羊水穿刺有什么区别?杭州无创DNA多少钱?经验分享