安卓系统video视频层级问题

在移动端网页含有video的时候,video的时候的层级总是最高的,现阶段ios系统已经解决了这个问题;但安卓系统总会出现:视频播放时,如果出现弹出层;弹出层就会被视频覆盖,相当别扭;

目前可想到的解决方案是:

在弹出层时;用canvar作图来代替视频当前位置:

var video = document.getElementsById('video');
var canvas = document.getElementById('canvas');
var w = video.offsetWidth;
var h = video.offsetHeight;
canvas.width = w;
canvas.height = h;
video.pause();
var ctx = canvas.getContext('2d');
ctx.drawImage(video,0,0,w,h);

并隐藏video元素。

这里说明下隐藏video是最好不要用“display:none”而是设定width = 0,height = 0来代替隐藏;

 

你可能感兴趣的:(安卓系统video视频层级问题)