控制条

<video/> 的属性 controls:

全屏时,默认控制条 现象的归纳:

1、windows chrome 版本 46.0.2490.86 m

video::-webkit-media-controls
{
  display:none !important;
}

video::-webkit-media-controls-enclosure
{
  display:none;
}

上面两者,只设置一个 即可使 默认的控制条隐藏掉,且不会影响到 自己写的<div/>的显示

2、android chromev41

2.1、

video::-webkit-media-controls
{
  display:none !important;
}

这个设置之后,默认控制台 和 自己写的<div/> 都显示不出来。

ZC:观察了一下,貌似 自己写的<div/> 虽然看不见,但是仍然可以被点击到...

2.2、

video::-webkit-media-controls-enclosure
{
  display:none;
}

只设置这个的话,在 video播放的时候  自己写的<div/>能够显示出来,在 video暂停的时候 自己写的<div/>看不到...

干脆:

在 Android上,不隐藏 默认的控制条了,默认的控制条 一般显示在视频下方,把 自己写的<div/> 显示在视频上方 得了...

原文地址:https://www.cnblogs.com/codeskilla/p/5013445.html