全屏切换

removeAttribute

对任何元素都有全屏操作和取消操作

使用H5的 api requesFullScreen cancelFullScreen

使用H5的api需要注意 某一些api比较新 浏览器还没有去支持 : 加自己浏览器的相关前缀  webkitRequestFullscreen(谷歌浏览器)

注意:

谷歌浏览器 webkit

safari浏览器 webkit

火狐浏览器 moz

欧朋浏览 o

IE浏览器 ms

 

开启全屏的时候写法 元素.前缀RequestFullscreen()

关闭全屏的时候 就不是操作这个元素了  要操作 document.前缀cancelFullScreen()

var box = document.querySelector('.box')
    // 开启全屏
    document.querySelector('.btn1').onclick = function () {
      box.webkitRequestFullscreen()
    }
    // 取消全屏
    document.querySelector('.btn2').onclick = function () {
      document.webkitCancelFullScreen()
    }

 

document.isFullScreen检测当前是否处于全屏

不同浏览器需要添加前缀

document.webkitIsFullScreen、document.mozIsFullScreen