1. 问题:
      使用video标签时,有些浏览器会显示视频的下载按钮,而这并不是我们需要的功能,必须想办法去掉。
  2.  
  3. 解决方法:
      使用下面的css可以达到隐藏下载按钮的效果,但是点击下载的位置,还是能出现开始下载的事件,所以暂未能彻底解决。
  4.  
  5. video::-internal-media-controls-download-button {
  6. display:none;
  7. }
  8.  
  9. video::-webkit-media-controls-enclosure {
  10. overflow:hidden;
  11. }
  12.  
  13. video::-webkit-media-controls-panel {
  14. width: calc(100% + 30px);
  15. }
  16.  
  17. 本文参考链接 https://www.cnblogs.com/tu-0718/p/6962928.html
           https://majing.io/questions/823

隐藏video标签的下载按钮的更多相关文章

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

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

  2. 干掉H5audio音频标签的下载按钮

    audio::-internal-media-controls-download-button {display:none;}audio::-webkit-media-controls {overfl ...

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

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

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

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

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

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

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

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

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

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

  8. h5的video下载按钮如何隐藏

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

  9. 谷歌浏览器:audio如何隐藏下载按钮

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

随机推荐

  1. 并查集+思维——X-Plosives

    一.问题描述(题目链接) 有n种化合物,每种化合物由两种元素组成.当几种的化合物数量等于他们所含不同元素的数量时,就会发生爆炸.现在依次给出化合物的组成,当新的化合物与之前的化合物放在一起会发生爆炸时 ...

  2. 美国司法部解禁guns打印技术

    今日导读 你知道什么是 3D 打印吗?简单的说,只要有一张设计蓝图和适当的材料,就可以快速打印出实体物件.而最近据外媒报道,从今年 8 月 1 日起,在美国,拥有或公布枪支 3D 打印蓝图的行为都将属 ...

  3. linux_1

    注: 创建软连接: "ln -s xxx 路径1" 在路径1创建xxx的软连接 特点: 1.文件类型 l 2.相当于windows的快捷方式 创建硬链接: "ln xxx ...

  4. Springboot 命令注入属性[--]&[-D]

    场景 在用Jenkins,做自动化部署时,遇到一些命令问题. 需要通过命令的形式,注入些业务值. -D 系统属性注入 Java,启动jar 命令: java [ options ] -jar file ...

  5. fossil 代理设置

    C:\>fossil user new Joe C:\>fossil user default Joe 设置账户 fossil setting proxy http://-:-fossil ...

  6. 把所有界面的状态栏字体颜色设置为白色--iOS开发系列---项目中成长的知识一

    第一步: 在info.plist中 View controller-based status bar appearance这个属性设置为 View controller-based status ba ...

  7. C# 读App.config配置文件[1]:.Net Framework框架

    C# 读App.config配置文件[1]:.Net Framework框架 C# 读App.config配置文件[2]: .Net Core框架 参考:https://www.cnblogs.com ...

  8. C\C++对于字符串输入处理

    1.scanf scanf以%s格式符读入字符串,会以空格为结束,也就是无法将空格读入.如果换成%c就可以读入,但是无法一次性读入一整行字符. 2.fgets 显然,fgets是一个读取带空格字符串的 ...

  9. 【Python学习之二】装饰器

    装饰器 首先,给出装饰器的框架: def log(func): def wrapper(*args, **kw): print('call %s():' % func.__name__) return ...

  10. vue2.0的基本特性

    本文目前总结的特性如下1.侦听属性和计算属性2.class的绑定3.条件渲染时的注意事项4.v-if和v-for同时使用的注意事项5.插槽6.ref,父组件调用子组件的另一种方式7.<keep- ...