我在网上找到的答案都是 z-index:2147483647 ,但是实际测试发现, 添加z-index还是无效 (chrome版本 94.0.4606.81)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
.show{
width:50vw; height:50vh; background-color:red;
position:absolute; z-index:2147483647;
}
</style>
</head>
<body>
<video src='https://www.runoob.com/try/demo_source/movie.mp4' controls></video>
<div class='show'></div>
</body>
</html>
但是我看 其他网站(如b站) 可以实现自定义播放条, 所以要怎样才能在video全屏后显示其他元素?
你没发现你说的这些网站,没有一个用的是自带的 Controls 么……都是自定义的。
默认的 Controls 全屏时只全屏了 video 这一个元素,所以你写的在 video 外层的那些元素就都不显示了;而自定义时你要全屏的是容器元素。
大概这样:
你自定义的全屏按钮要控制
container
全屏,而不是单单只控制video
全屏。