h5的video下载按钮如何隐藏
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下载按钮如何隐藏的更多相关文章
- html中如何移除video下载按钮
我发现部分安卓手机使用video标签播放视频的时候会自带一个下载按钮,一般产品大多都不需要这一功能,那如何屏蔽下载按钮呢?有下面两种,请一定使用第一种方式,使用css控制会有兼容性问题,建议不要使用这 ...
- html页面原生video标签隐藏下载按钮
在写web项目的时候,遇到简介页面有一个单独的简介视频,只有这一个短短的视频所以没有使用任何video组件,所以运用原生video标签就想解决问题. 虽然简介视频是非付费的,但也不希望会有下载按钮或者 ...
- Chrome浏览器video样式控制-隐藏下载按钮
Chrome浏览器在升级之后 video的样式和之前是不一样的,如果使用原生video的话可能会有影响,实际项目中最好使用第三方插件以保证video在所有浏览器都有统一的样式 一.如何隐藏video的 ...
- 如何隐藏 video 元素的下载按钮
1. 使用 video 元素的 ControlList API <video controls controlsList="nodownload"></video ...
- 隐藏video标签的下载按钮
问题: 使用video标签时,有些浏览器会显示视频的下载按钮,而这并不是我们需要的功能,必须想办法去掉. 解决方法: 使用下面的css可以达到隐藏下载按钮的效果,但是点击下载的位置,还是能出现开始下载 ...
- 【HTML5】video 标签禁用自带的下载按钮
h5自带的 video标签 ,会有个下载按钮,有时候想避免,就可以利用样式的方法 <style type="text/css"> video::-internal-me ...
- 用HTML5 video标签插入视频,在谷歌浏览器上播放视频时,右下角显示的下载按钮怎么去掉
使用H5的video标签可以直接插入视频,一般在浏览器效果如下图显示: 但有时在谷歌浏览器上显示,会遇到右下角有下载按钮.如果项目要求去掉这个下载按钮,怎么办呢?如下图显示: 分析: 经本人测试,是谷 ...
- 谷歌浏览器:audio如何隐藏下载按钮
当我们使用原生的audio标签时,可以看到如下的效果. 那么如何让下载按钮隐藏掉呢? 1. controlsList="nodownload" // 这个方法只支持 Chrome ...
- 去掉谷歌浏览器 video标签下的下载按钮
一.判断浏览器版本(区分谷歌和360浏览器) function myBrowser(){ var userAgent = navigator.userAgent; //取得浏览器的userAgent字 ...
随机推荐
- PHP笔记:单引号与双引号区别
PHP笔记:单引号与双引号区别 php中使用字符串时,可以使用单引号或者双引号,这里总结一下二者的不同: 一.解析字符内容 双引号中的变量会会经过编译器解析 单引号中的变量不会被解析 如下: < ...
- Linux安装网易云音乐
⒈下载最新版网易云音乐安装包 http://d1.music.126.net/dmusic/netease-cloud-music_1.2.0_amd64_ubuntu_20190424_1.deb ...
- NB-IoT是怎么工作的,是否支持基站定位?【转】
转自:http://www.elecfans.com/iot/779658.html 根据我国无线电管理相关要求,明确NB-IoT系统基站应到到属地无线电管理机构办理设台审批,领取无线电台执照.同时, ...
- WPF 10天修炼 第三天- Application全局应用程序类
Application对象 当一个WPF应用程序启动时,首先会实例化一个全局唯一的Application对象,类似于WinForm下的Application类,用于控制整个应用程序,该类将用于追踪应用 ...
- Flask+SQLAlchemy+alembic+Flask-RESTful使用
前言 其实准备把这篇删掉,先写Flask-restful相关的,后来想想大体框架还是先写出来,这两天踩了很多坑,有的谷歌也没有答案.一直摸索也总算是开始了. 正文 SQLAlchemy/alembic ...
- MySQL时区错误导致server time zone value 'Öйú±ê׼ʱ¼ä' 错误
时区错误 由于中国是东八区,跟mysql配置不同,需要修改: 管理员登录MySQL OK成功
- jsp多模块相同数据提交到后台之数据处理
最近在写一个java多模块表单提交,起初想的只是一个简单的form表单提交,写的时候发现不是真简单.多个相同类型数据提交到后台接收的问题很困难. 于是,和人进行深入的讨论,感觉j以json的格式提交时 ...
- 初识C语言 (四)
分支结构 if语句 C语言中的分支结构语句中的if条件语句,简单if语句的基本结构如下: 其语义是:如果表达式的值为真,则执行其后的语句,否则不执行该语句. 其过程可表示为下图 实例: if(resu ...
- AJAX的原理
AJAX 什么是AJAX AJAX= Asynchronous JavaScript and XML(异步的 JavaScript 和 XML): AJAX 不是新的编程语言,而是一种使用现有标准的新 ...
- ORACLE根据两个表都含有的字段条件来判断两个表连接后有没有数据
A表 字段1 字段2 B表 字段1 字段3 A表的字段1=B表的字段1 SELECT DISTINCT A.字段2 FROM TABEL1 A ,TABEL2 B WHERE A.字段1 ...