使用js h5 写了一个播放器，然后放在安卓app中,点击全屏就是横屏重载,重载之后再点击全屏,他就全屏了,请问如何解决???

Question

// 切换全屏

document.querySelector('#fullScreen').onclick = function (){
    if(videoDom.requestFullscreen){
        videoDom.requestFullscreen();
    }else if(videoDom.webkitRequestFullScreen){
        videoDom.webkitRequestFullScreen()
    }else if(videoDom.msRequestFullscreen){
        videoDom.msRequestFullscreen();
    }else if(this.mozRequestFullScreen){
        videoDom.mozRequestFullScreen();
    }
}

JS控制全屏代码如上,现在的情况就是,用video自带的controls属性出现的控制器点击全屏也是横屏重载,用了video.js插件就是不显示全屏的按钮,在PC调试的时候出来了,已经不知道怎么解决了,这个问题我是不是应该交给原生来实现???求大佬解答一下

Answer 1

video 标签会显示在最顶层，需要先设置 position:absolute 脱离文档流，然后再用 z-index 置于下层