全屏显示
Element.requestFullscreen() 方法用于发出异步请求使元素进入全屏模式。
调用此API并不能保证元素一定能够进入全屏模式。如果元素被允许进入全屏幕模式,返回的Promise会resolve,并且该元素会收到一个fullscreenchange事件,通知它已经进入全屏模式。如果全屏请求被拒绝,返回的promise会变成rejected并且该元素会收到一个fullscreenerror事件。如果该元素已经从原来的文档中分离,那么该文档将会收到这些事件。
function openFullscreen (ele) {
//ele 需要全屏的元素 例如#document.body 整个网页全屏,也可以是某个div元素
if (ele.requestFullscreen) {
ele.requestFullscreen();
} else if (ele.mozRequestFullScreen) {
ele.mozRequestFullScreen();
} else if (ele.webkitRequestFullscreen) {
ele.webkitRequestFullscreen();
} else if (ele.msRequestFullscreen) {
ele.msRequestFullscreen();
}
}
判断当前是否已全屏
var element = document .fullscreenElement;
如果element处于全屏模式则返回这个对象; 如果element当前未使用全屏模式,则返回值为null。
function isFullscreen () {
return document.fullscreenElement ||
document.msFullscreenElement ||
document.mozFullScreenElement ||
document.webkitFullscreenElement || false;
}
退出全屏
document.exitFullscreen();
Document.exitFullscreen() 方法用于让当前文档退出全屏模式。调用这个方法会让文档回退到上一个调用Element.requestFullscreen()方法进入全屏模式之前的状态。
function exitFullscreen () {
if (document.exitFullScreen) {
document.exitFullScreen();
} else if (document.mozCancelFullScreen) {
ele.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
}
发表回复
要发表评论,您必须先登录。