Vue js让指定div容器全屏

vue yekong 41℃
  export default {
  name: 'top',
  components: {},
  props: {
    id: {
      type: String,
      default () {
        return ''
      }
    }
  },
  data () {
    return {
      time: moment().format('YYYY-MM-DD HH:mm:ss'),
      a: 0,
    }
  },
  watch: {},
  mounted () {
    var that = this
  },
  methods: {
    quanping () {
      this.a++
      this.a % 2 == 1 ? this.enterfullscreen() : this.exitfullscreen()
    },
    //控制全屏
    enterfullscreen () { //进入全屏
      var docElm = document.getElementById('homeid')  // 指定容器id
      //W3C
      if (docElm.requestFullscreen) {
        docElm.requestFullscreen()
      }
      //FireFox
      else if (docElm.mozRequestFullScreen) {
        docElm.mozRequestFullScreen()
      }
      //Chrome等
      else if (docElm.webkitRequestFullScreen) {
        docElm.webkitRequestFullScreen()
      }
      //IE11
      else if (elem.msRequestFullscreen) {
        elem.msRequestFullscreen()
      }
    },
    //退出全屏
    exitfullscreen () {
      if (document.exitFullscreen) {
        document.exitFullscreen()
      } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen()
      } else if (document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen()
      } else if (document.msExitFullscreen) {
        document.msExitFullscreen()
      }
    }
  }
}
喜欢 (0)