HTML页面原生VIDEO标签隐藏下载按钮功能

互联网 18-5-5
这篇文章主要介绍了HTML页面原生VIDEO标签隐藏下载按钮功能,非常不错,具有参考借鉴价值,需要的朋友参考下吧

在写web项目的时候,遇到简介页面有一个单独的简介视频,只有这一个短短的视频所以没有使用任何video组件,所以运用原生video标签就想解决问题。

虽然简介视频是非付费的,但也不希望会有下载按钮或者可以视频另存为,所以找到一个可以看上去没有下载功能的方法,做一下笔记。

想要隐藏以上下载按钮,三个样式就可以了,不废话直接贴代码:

video::-internal-media-controls-download-button {      display:none;  }  video::-webkit-media-controls-enclosure {      overflow:hidden;  }  video::-webkit-media-controls-panel {      width: calc(100% + 50px);   }

说白了就是把下载按钮移动到视窗外面,但是这些CSS找了好久啊!!

这种方法并不能真正阻止视频的下载,“有心”的用户还是可以在缓存文件里找到加载过的视频文件的,所以就像标题写的一样,只是隐藏。

真正的阻止视频的下载还是需要通过服务器端对视频地址进行加密验证。

相关推荐:

HTML5 video视频字幕的使用和制作方法

HTML5触摸事件实现移动端简易进度条的实现方法

以上就是HTML页面原生VIDEO标签隐藏下载按钮功能的详细内容,更多内容请关注技术你好其它相关文章!

来源链接:
免责声明:
1.资讯内容不构成投资建议,投资者应独立决策并自行承担风险
2.本文版权归属原作所有,仅代表作者本人观点,不代表本站的观点或立场
标签: 标签
上一篇:php获取远程图片并下载保存到本地的方法分析 下一篇:HTML5触摸事件实现移动端简易进度条的实现方法

相关资讯