全屏显示

js设置点击全屏,怎么不让他跳转其他窗口时退出全屏呢

FineReport kzl 发布于 2023-2-24 12:02
1min目标场景问卷 立即参与
回答问题
悬赏:3 F币 + 添加悬赏
提示:增加悬赏、完善问题、追问等操作,可使您的问题被置顶,并向所有关注者发送通知
共2回答
最佳回答
0
15922204585Lv6高级互助
发布于2023-2-24 12:07

其它窗口初始化全屏试试

最佳回答
0
NikoZhouLv3见习互助
发布于2023-2-24 12:37(编辑于 2023-2-24 12:37)

要禁止在全屏模式下跳转其他窗口时退出全屏,可以在进入全屏模式之前记录当前窗口的位置和大小,在退出全屏模式时将窗口恢复到之前的位置和大小。这样,当在全屏模式下跳转其他窗口时,窗口会恢复到之前的大小和位置,而不会退出全屏模式。

// 获取需要全屏的元素 var elem = document.documentElement; // 在进入全屏模式之前,记录当前窗口的位置和大小 var originalWidth = window.innerWidth; var originalHeight = window.innerHeight; var originalLeft = window.screenX; var originalTop = window.screenY; // 进入全屏模式 if (elem.requestFullscreen) {   elem.requestFullscreen(); } else if (elem.webkitRequestFullscreen) { /* Safari */   elem.webkitRequestFullscreen(); } else if (elem.msRequestFullscreen) { /* IE11 */   elem.msRequestFullscreen(); } // 监听fullscreenchange事件,用于检测是否处于全屏模式 document.addEventListener("fullscreenchange", function () {   // 如果不处于全屏模式,则恢复之前的窗口大小   if (!document.fullscreenElement) {     // 恢复窗口大小     window.resizeTo(originalWidth, originalHeight);     window.moveTo(originalLeft, originalTop);   } });

在这个示例中,我们首先获取需要全屏的元素,这里我们选择了整个页面的根元素。然后,在进入全屏模式之前,我们记录当前窗口的位置和大小。在进入全屏模式后,我们监听Fullscreen API中提供的fullscreenchange事件,用于检测是否处于全屏模式。在该事件发生时,我们检测是否处于全屏模式,如果不是,则恢复之前的窗口大小。这样,在全屏模式下跳转其他窗口时,窗口会恢复到之前的大小和位置,而不会退出全屏模式。

  • 3关注人数
  • 348浏览人数
  • 最后回答于:2023-2-24 12:37
    请选择关闭问题的原因
    确定 取消
    返回顶部