html5 中的 video 标签 在有些 android 机上面层级好高， z-index 控制不了。
vv122483 · 2015-03-03 14:00:08 +08:00 · 22071 次点击这是一个创建于 3583 天前的主题，其中的信息可能已经有所发展或是发生改变。
RT：求大神指教一下，有没有人遇到过这种问题。在视频上面加个字都加不了。被视频的层级盖住。
 |
1
learnshare 2015-03-03 14:07:05 +08:00
别用 z-index，用定位，后面的标签会覆盖在前边标签的上面。
video 应该和 img 类似的层级，不是很高吧。 demo code: <div class="video-div"> <video src="abc.mp4"></video> <span class="over-text">text over the video</span> </div> .video-div{ position: relative; } .over-text{ position: absolute; left: ?; bottom: ?; } |
 |
2
vv122483 OP @learnshare 这个在pc 上都是可以的，我的n5还有苹果上也是可以的，就是在有的android机子上面，像红米，魅蓝什么的机子上面，video感觉层级是max的，只要一播放视频，就感觉脱离文档束缚，跑到最前面去了，根本没法控制
|
|
3
learnshare 2015-03-03 14:28:24 +08:00
@vv122483 你想加字幕，还是视频作为背景？
|
|
4
vv122483 OP @learnshare 都行。我现在在测试。。给你看一个连接。。http://houzijiu.oicp.net:45754/video-js/
|
|
5
vv122483 OP @learnshare 点击播放视频后，文字就被盖住了！！！被这个问题搞死了。。
|
 |
7
cst4you 2015-03-03 14:44:11 +08:00
研究下 bilibili 的手机版看看?
|
 |
8
caomu 2015-03-03 15:02:31 +08:00 via Android
我猜是这些中低端手机为了“用户体验”，自动识别视频并突出播放，就像对flash视频那样。
|
|
9
learnshare 2015-03-03 15:38:49 +08:00
|
 |
10
FuryBean 2015-03-03 18:18:37 +08:00
我估计视频这个标签和早期Android版本的input type=password是一样的(现在是不是这样我就不清楚了)，在显示的时候实际使用的真正的原生组件覆盖到最上面（input type=password是点击后才会显示成原生组件）。
input type=password的这个行为是可以使用CSS控制的，可以控制只使用Webkit自带的文本框。 鉴于楼主出现问题的机器都是国产机，我估计就没那么乐观了。 |
 |
11
NicholasNC 2017-06-29 17:54:11 +08:00
|
 |
12
wujunchuan2008 2018-01-08 15:56:12 +08:00
播放器在移动端(尤其是在 X5 内核的浏览器中)会有一些异常.表现在会将 video 标签提升为 Native 控件,覆盖掉底下的 HTML 元素.(原生组件优先级肯定要优先于 HTML 元素)
|
Select Language