css中如何实现video屏蔽下载功能

这篇文章给大家分享的是有关css中如何实现video屏蔽下载功能的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

在多伦等地区,都构建了全面的区域性战略布局,加强发展的系统性、市场前瞻性、产品创新能力,以专注、极致的服务理念,为客户提供成都网站建设、网站设计 网站设计制作定制网站建设,公司网站建设,企业网站建设,品牌网站设计,全网营销推广,外贸网站制作,多伦网站建设费用合理。

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

css中如何实现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找了好久啊!!

css中如何实现video屏蔽下载功能

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

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

感谢各位的阅读!关于“css中如何实现video屏蔽下载功能”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!


文章名称:css中如何实现video屏蔽下载功能
文章链接:http://ybzwz.com/article/iehdsg.html