vue实现进入全屏和退出全屏

最近一个项目需要进行大屏展示,所以登录完就要处于一个全屏的状态,当切换到控制台之后就可以退出全屏。在登录之后调用enterFullscreen方法,就可以进入全屏。在点击切换到控制台时,可以调用exitFullscreen方法。

enterFullscreen() {
			const element = document.documentElement
			if (element.requestFullscreen) {
				element.requestFullscreen()
			} else if (element.mozRequestFullScreen) {
				element.mozRequestFullScreen()
			} else if (element.webkitRequestFullscreen) {
				element.webkitRequestFullscreen()
			} else if (element.msRequestFullscreen) {
				element.msRequestFullscreen()
			}
		},
exitFullscreen() {
			if (
				document.fullscreenElement ||
				document.webkitFullscreenElement ||
				document.mozFullScreenElement ||
				document.msFullscreenElement
			) {
				if (document.exitFullscreen) {
					document.exitFullscreen()
				} else if (document.webkitExitFullscreen) {
					document.webkitExitFullscreen()
				} else if (document.mozCancelFullScreen) {
					document.mozCancelFullScreen()
				} else if (document.msExitFullscreen) {
					document.msExitFullscreen()
				}
			}
		},

 

相关推荐

  1. vue实现进入退出

    2023-12-13 14:42:02       45 阅读
  2. vue退出

    2023-12-13 14:42:02       30 阅读
  3. 插件监听进入退出事件

    2023-12-13 14:42:02       12 阅读
  4. vue事件与关闭事件

    2023-12-13 14:42:02       40 阅读
  5. react 显示实现

    2023-12-13 14:42:02       18 阅读
  6. 鸿蒙实现沉浸式模式

    2023-12-13 14:42:02       18 阅读
  7. CEF 窗口

    2023-12-13 14:42:02       46 阅读
  8. Android 横竖切换 窗口

    2023-12-13 14:42:02       40 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-13 14:42:02       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-13 14:42:02       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-13 14:42:02       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-13 14:42:02       20 阅读

热门阅读

  1. 观鹤笔记2

    2023-12-13 14:42:02       30 阅读
  2. MySQL笔记-第15章_存储过程与函数

    2023-12-13 14:42:02       32 阅读
  3. 组件库篇 | EUI | API文档

    2023-12-13 14:42:02       29 阅读
  4. 记一次webpack配置文件外置

    2023-12-13 14:42:02       42 阅读
  5. c++ 常用的一些宏定义

    2023-12-13 14:42:02       33 阅读
  6. uniapp中this有时打印的是undefined(作用域问题)

    2023-12-13 14:42:02       51 阅读
  7. assert 是一个断言语句

    2023-12-13 14:42:02       40 阅读
  8. 【DL-TensorFlow遇错】TensorFlow中遇错合集

    2023-12-13 14:42:02       43 阅读
  9. 创建链表时的一个小bug

    2023-12-13 14:42:02       36 阅读