Chrome浏览器video样式控制-隐藏下载按钮
Chrome浏览器在升级之后 video的样式和之前是不一样的,如果使用原生video的话可能会有影响,实际项目中最好使用第三方插件以保证video在所有浏览器都有统一的样式
一、如何隐藏video的下载按钮
1. 在Chrome58以上的版本中使用 video元素的 controlsList API :https://googlechrome.github.io/samples/media/controlslist.html 代码如下:
<video controls controlsList="nodownload"></video>
2. 在Chrome58以下的版本中使用css去控制,简单来说就是将下载按钮挤出可见范围,这样就可以变相的认为按钮被隐藏了,代码如下:
video::-webkit-media-controls {
overflow: hidden !important;
}
video::-webkit-media-controls-enclosure {
width: calc(100% + 32px);
margin-left: auto;
}
Chrome浏览器video样式控制-隐藏下载按钮的更多相关文章
- 去掉谷歌浏览器 video标签下的下载按钮
一.判断浏览器版本(区分谷歌和360浏览器) function myBrowser(){ var userAgent = navigator.userAgent; //取得浏览器的userAgent字 ...
- 手把手教你Chrome浏览器安装Postman(含下载云盘链接)【转载】
转载自:http://www.ljwit.com/archives/php/278.html 说明: Postman不多介绍,是一款功能强大的网页调试与发送网页HTTP请求的Chrome插件.本文主要 ...
- html页面原生video标签隐藏下载按钮
在写web项目的时候,遇到简介页面有一个单独的简介视频,只有这一个短短的视频所以没有使用任何video组件,所以运用原生video标签就想解决问题. 虽然简介视频是非付费的,但也不希望会有下载按钮或者 ...
- 手把手教你Chrome浏览器安装Postman(含下载云盘链接)(转)
文章转自http://www.ljwit.com/archives/php/278.html 说明: Postman不多介绍,是一款功能强大的网页调试与发送网页HTTP请求的Chrome插件.本文主要 ...
- 谷歌浏览器:audio如何隐藏下载按钮
当我们使用原生的audio标签时,可以看到如下的效果. 那么如何让下载按钮隐藏掉呢? 1. controlsList="nodownload" // 这个方法只支持 Chrome ...
- [转]Chrome浏览器的离线安装包下载地址
每当chrome有更新之后,都有不少用户想要下载离线版的安装文件,但苦于找不到下载地址而发愁,其实这个问题很简单,下面我来分享一下方法(仅针对Windows操作系统): 对于稳定版(正式版)Chrom ...
- Chrome浏览器Json查看插件JsonHandle下载以及无法安装插件的解决方法
场景 在使用Chrome浏览器查看Json数据时如果没有插件会挤作一团. 安装JsonHandle插件后 博客: https://blog.csdn.net/badao_liumang_qizhi 关 ...
- IE 、Firefox、Chrome 浏览器在 F12 控制台下切换至不同框架介绍
有不少网页的页面,还在使用 iframe 标签,而此时,相当于页面有两个 window 对象,一个为当前页面 window ,另一个则为 iframe 页面下的 window .因为,有时候需要在 c ...
- audio隐藏下载按钮
// 这个方法只支持 Chrome 58+, 低于该版本的是没有无法隐藏的 <audio src="/i/horse.ogg" controls="controls ...
随机推荐
- Windows 7 64 位操作系统安装 Ubuntu 17.10
一.准备工作 1. DiskGenius:分区工具,为 Linux 建立单独的分区.(Linux 公社下载源) 2. UUI:Universal USB Installer,通用 U 盘安装器,用来制 ...
- Linux 内核进程管理之进程ID【转】
转自:http://www.cnblogs.com/hazir/p/linux_kernel_pid.html Linux 内核使用 task_struct 数据结构来关联所有与进程有关的数据和结构, ...
- Term Term ssh登陆linux后 显示乱码
setup----terminal----locale----“chinese” OK!!!!!
- 121.Best Time to Buy and Sell Stock---dp
题目链接:https://leetcode.com/problems/best-time-to-buy-and-sell-stock/description/ 题目大意:给出一串数组,找到差值最大的差 ...
- 大数据系列之kafka-java实现
Java源码GitBub地址: https://github.com/fzmeng/kafka-demo 关于kafka安装步骤可见文章 http://www.cnblogs.com/cnmeng ...
- HDU 6194 string string string 2017沈阳网络赛 后缀数组
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6194 题意:告诉你一个字符串和k , 求这个字符串中有多少不同的子串恰好出现了k 次. 解法:后缀数组 ...
- openstack环境下的虚拟机通过浮动IP访问后能ping通外网IP不能ping通域名
1.环境简介 openstack环境下构造Ubuntu系统的VM,VM配置受管子网和自管子网,同时绑定浮动IP 2.通过浮动IP访问VM后,ping www.baidu.com失败,但是通过IP地址p ...
- Linux/Unix 怎样找出并删除某一时间点的文件
Linux/Unix 怎样找出并删除某一时间点的文件 在Linux/Unix系统中,我们的应用每天会产生日志文件,每天也会备份应用程序和数据库,日志文件和备份文件长时间积累会占用大量的存储空间,而有些 ...
- 终止函数 atexit()
函数名: atexit 头文件:#include<stdlib.h> 功 能: 注册终止函数(即main执行结束后调用的函数) 用 法: int atexit(void (*f ...
- python_xlsxwriter模块
1.workbook类 add_worksheet 用于添加一个新的工作表,sheetname为工作表名称,默认是sheet1,例如: worksheet = workbook.add_workshe ...