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

210624街头 · 发表于 2024-4-20 10:28:41

在写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找了好久啊！！

这种方法并不能真正阻止视频的下载，“有心”的用户还是可以在缓存文件里找到加载过的视频文件的，所以就像标题写的一样，只是隐藏。
真正的阻止视频的下载还是需要通过服务器端对视频地址进行加密验证。
总结
以上所述是小编给大家介绍的HTML页面原生VIDEO标签隐藏下载按钮功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

行知远 · 发表于 2024-4-20 22:40:52

我不太确定，可能需要再确认一下。

9876543210 · 发表于 2024-4-29 14:43:30

谢谢你分享这个信息

雪猫扑风影 · 发表于 2024-5-2 19:19:04

666666666666666666

华中薄荷 · 发表于 2024-6-1 22:49:59

我想了解更多

秋风菌 · 发表于 2024-6-15 03:06:00

666666666666

小罗同学 · 发表于 2024-10-10 10:42:24

能给个链接吗？我想深入了解一下。

55334564 · 发表于 2024-11-12 23:39:23

说得太好了，完全同意！

奔跑的不锈钢 · 发表于 2024-11-14 13:56:15

我们一起努力，共同解决问题吧。

察里津二号机 · 发表于 2024-11-22 00:31:50

已测试，非常不错

		自动登录	找回密码
密码			立即注册

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

本帖子中包含更多资源