隐藏video标签的下载按钮

问题:  使用video标签时,有些浏览器会显示视频的下载按钮,而这并不是我们需要的功能,必须想办法去掉。

解决方法:  使用下面的css可以达到隐藏下载按钮的效果,但是点击下载的位置,还是能出现开始下载的事件,所以暂未能彻底解决。

video::-internal-media-controls-download-button {
    display:none;
}

video::-webkit-media-controls-enclosure {
    overflow:hidden;
}

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

本文参考链接 https://www.cnblogs.com/tu-0718/p/6962928.html       https://majing.io/questions/823

原文地址:https://www.cnblogs.com/gyfluck/p/8117999.html

时间: 2024-10-03 15:16:20

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

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

audio::-internal-media-controls-download-button {display:none;}audio::-webkit-media-controls {overflow: hidden !important}audio::-webkit-media-controls-enclosure {width: calc(100% + 32px);}

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

一.判断浏览器版本(区分谷歌和360浏览器) function myBrowser(){ var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var isOpera = userAgent.indexOf("Opera") > -1; if (isOpera) { return "Opera" }; //判断是否Opera浏览器 if (userAgent.indexOf("Firefo

HTML5 video标签播放视频下载原理

HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload="metadata"> <!-- https://bugzilla.mozilla.org/show_bug.cgi?id=676422 --> <source src="assets/dizzy.mp4" type="video/mp4"

表单/iframe与video标签

<form action="所有表单值提交的地址" method="传值的方式默认是GET方式,还有另一种POST方式"> 表单元素</form>--> <!--提交方式: 1.get: 所有表单的数据以键值对的方式 key=value的方式传递给后台 url:请求地址?key1=value1&key2=value2&key3=value3&..... 缺点:不安全,传递的内容大小有限制 2.post: 不

HTML5移动开发之路(14)——Video标签详解

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(14)--Video标签详解 一.使用技巧 在HTML5中可以使用<audio>或者<video>标签播放html5媒体,使用方式如下: [html] view plaincopyprint? <video src="move.mp4"></video> video标签中有很多属性,例如controls属性可以控制是否有控制台. [html] vie

HTML5中video标签与canvas绘图的使用

video标签的使用 video标签定义视频, 它是html5中的新标签, 它的属性如下(参考自文档): domo01 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>demo01</title> </head> <body> <video src="madashu

HTML5 VIDEO标签

属性: src :视频的属性 poster:视频封面,没有播放时显示的图片 preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览器自带的控制条 width:视频宽度 height:视频高度 获取video标签:var Media = document.getElementById("video"); Media.error; //null:正常 Media.error.code; //1.用户终止 2.网络错误 3.解码错误 4.URL无效 /

【转载】HTML5 Audio/Video 标签,属性,方法,事件汇总

<audio> 标签属性: src:音乐的URL preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览器自带的控制条 Html代码 <audio id=”media” src=”http://www.abc.com/test.mp3″ controls></audio> <video> 标签属性: src:视频的URL poster:视频封面,没有播放时显示的图片 preload:预加载 autoplay:自动播放

关于HTML5中Video标签无法播放mp4的解决办法

1.首先先排除掉代码问题.路径问题.浏览器不支持问题等常规问题,这些问题另行百度. <video width="500px" height="300px" autoplay="autoplay"> <source src="D:/video/hbg.mp4" type="video/mp4"> </video> 2.首先我自己从网上下载的一个MP4文件,IE10和谷歌都能