vue点击全屏显示按esc或F11退出全屏显示

最新推荐文章于 2024-07-23 16:01:04 发布

新宇最优秀

最新推荐文章于 2024-07-23 16:01:04 发布

阅读量825

点赞数 1

本文链接：https://blog.csdn.net/tendernessxy/article/details/119823998

版权

全屏 JavaScript requestFullscreen 浏览器兼容性网页交互

关键词由CSDN通过智能技术生成

首先定义一个按钮

<div class="con" @click="fullScreen">

        <a-icon type="fullscreen" style="font-size: 18px; margin: 1px 5px 0 0" />

        <div>全屏</div>

 </div>

    // 全屏
    fullScreen() {
      let element = document.getElementById('map-container')
      if (element.requestFullscreen) {
        element.requestFullscreen()
      } else if (element.webkitRequestFullScreen) {
        element.webkitRequestFullScreen()
      } else if (element.mozRequestFullScreen) {
        element.mozRequestFullScreen()
      } else if (element.msRequestFullscreen) {
        element.msRequestFullscreen()
      }
      this.fullscreen = !this.fullscreen
    },