js 浏览器全屏

切换全屏状态

// 定义一个变量用于跟踪是否处于全屏状态
this.isFull = !this.isFull;

// 定义一个对象,其中包含用于进入和退出全屏模式的各种浏览器方法
var documentMethods = {
    // 用于进入全屏的方法列表
    enter: ['requestFullscreen', 'mozRequestFullScreen', 'webkitRequestFullscreen', 'msRequestFullscreen'],
    
    // 用于退出全屏的方法列表
    exit: ['cancelFullScreen', 'mozCancelFullScreen', 'webkitCancelFullScreen', 'msCancelFullScreen']
};

// 检查是否要进入全屏模式
if (this.isFull) {
    // 找到支持的进入全屏方法并执行
    document.documentElement[documentMethods.enter.filter((method) => {
        return document.documentElement[method];
    })[0]]();
} else {
    // 找到支持的退出全屏方法并执行
    document[documentMethods.exit.filter((method) => {
        return document[method];
    })[0]]();
}

posted on 2021-10-27 16:07  完美前端  阅读(89)  评论(0)    收藏  举报

导航