h5的video下载按钮在部分手机系统上是不可用的，想要把这个按钮屏蔽掉，可苦于没有像屏蔽全屏按钮那样的伪类video::-webkit-media-controls-fullscreen-button {display: none;}

只好找了一种比较搓的方法：

video::-webkit-media-controls-enclosure {
    overflow:hidden;
}
video::-webkit-media-controls-panel {
     width: calc(100% + 30px);
}

用CSS hacker的方式并非好的方案，这依赖于chrome的DOM选择器，一旦DOM结构变化可能就会导致方案失效。

通过加长控制条内容的宽度，超出部分不显示，达到了目的，不知大家有没有更好的方法？

h5的video下载按钮如何隐藏的更多相关文章

  1. html中如何移除video下载按钮

    我发现部分安卓手机使用video标签播放视频的时候会自带一个下载按钮,一般产品大多都不需要这一功能,那如何屏蔽下载按钮呢?有下面两种,请一定使用第一种方式,使用css控制会有兼容性问题,建议不要使用这 ...

  2. html页面原生video标签隐藏下载按钮

    在写web项目的时候,遇到简介页面有一个单独的简介视频,只有这一个短短的视频所以没有使用任何video组件,所以运用原生video标签就想解决问题. 虽然简介视频是非付费的,但也不希望会有下载按钮或者 ...

  3. Chrome浏览器video样式控制-隐藏下载按钮

    Chrome浏览器在升级之后 video的样式和之前是不一样的,如果使用原生video的话可能会有影响,实际项目中最好使用第三方插件以保证video在所有浏览器都有统一的样式 一.如何隐藏video的 ...

  4. 如何隐藏 video 元素的下载按钮

    1. 使用 video 元素的 ControlList API <video controls controlsList="nodownload"></video ...

  5. 隐藏video标签的下载按钮

    问题: 使用video标签时,有些浏览器会显示视频的下载按钮,而这并不是我们需要的功能,必须想办法去掉. 解决方法: 使用下面的css可以达到隐藏下载按钮的效果,但是点击下载的位置,还是能出现开始下载 ...

  6. 【HTML5】video 标签禁用自带的下载按钮

    h5自带的 video标签 ,会有个下载按钮,有时候想避免,就可以利用样式的方法 <style type="text/css"> video::-internal-me ...

  7. 用HTML5 video标签插入视频，在谷歌浏览器上播放视频时，右下角显示的下载按钮怎么去掉

    使用H5的video标签可以直接插入视频,一般在浏览器效果如下图显示: 但有时在谷歌浏览器上显示,会遇到右下角有下载按钮.如果项目要求去掉这个下载按钮,怎么办呢?如下图显示: 分析: 经本人测试,是谷 ...

  8. 谷歌浏览器：audio如何隐藏下载按钮

    当我们使用原生的audio标签时,可以看到如下的效果. 那么如何让下载按钮隐藏掉呢? 1. controlsList="nodownload" // 这个方法只支持 Chrome ...

  9. 去掉谷歌浏览器 video标签下的下载按钮

    一.判断浏览器版本(区分谷歌和360浏览器) function myBrowser(){ var userAgent = navigator.userAgent; //取得浏览器的userAgent字 ...

随机推荐

  1. spring boot集成netty-服务端和客户端demo

    项目源码:https://github.com/zhzhair/spring-boot-netty.git 项目启动说明:服务端--spring-boot-netty-server,客户端--spri ...

  2. mybatis一对多查询之collection的用法

    首先看一下返回的数据的格式: //获取端子信息List<Map<String, Object>> portList = doneTaskDao.queryTroubleTask ...

  3. VMware虚拟机配置内网电脑能访问

    关键字:内网访问虚拟机.内网访问Linux虚拟机.虚拟机访问外部网络 1.vmware虚拟机网络设置为桥接模式 2.虚拟机配置iP地址,以linux系统为示例. 勾选自动连接,选择手动配置ip,然后配 ...

  4. JAVA 数组作为方法返回值—返回地址

    package Code411;/*一个方法可以有0,1,多个 参数,但只能有0和1个返回值希望一个方法产生多个结果数据进行返回 数组作为方法的参数,传递进去的是数组的地址值. */public cl ...

  5. luoguP1373 小a和uim之大逃离

    DP专题 题目链接 思路 \(f[i][j][a][b][0/1]\)表示在\((i,j)\)这个格子,小a有a滴魔液,他的伙伴有b滴,上一步是小a(0)或者他的伙伴(1)吸取的魔液. (显然)数组开 ...

  6. 《剑指offer》左旋转字符串

    本题来自<剑指offer> 反转链表 题目: 思路: C++ Code: Python Code: 总结:

  7. tomcat 网页管理tomcat

    一.设置管理员账户密码 进入tomcat安装目录 ->进入conf目录->修改user.xml->加入下面内容 模板 <role rolename="manager- ...

  8. filp_open/filp_close/vfs_read/vfs_write

    Linux系统成功的关键因素之一就是具有与其他操作系统和谐共存的能力.Linux系统的文件系统由两层结构构建:第一层是虚拟文件系统(VFS),第二层是各种不同的具体的文件系统. VFS就是把各种具体的 ...

  9. PHP实现url参数组合字符串与数组相互转换

    $data = array( 'name' => 'tom', 'sex' => 1, 'channel' => 'ty' ); 数组转url参数字符串 $queryStr = ht ...

  10. 史上最全的select加锁分析(Mysql)

    引言 大家在面试中有没遇到面试官问你下面六句Sql的区别呢 select * from table where id = ? select * from table where id < ? s ...