无锡网站建设：video视频如何禁止右键保存

　很多时候给网站添加视频是非常增彩的一波操作，而辛苦制作的视频不想被太多人下载，影响网站负载能力怎么办？那么就需要禁止右键保存视频。

　　【最简单粗暴的解决方法】

　　1、在网页head部分添加如下代码

　　<script type="text/javascript">

　　//禁止ctrl复制

　　document.onkeydown=function(){

　　if((event.ctrlKey) && (window.event.keycode==67)){

　　event.returnValue=false;

　　alert("啊哦，不好意思，网页禁止复制！");

　　}

　　}

　　document.onmousedown=function(){

　　if(event.button==2){

　　event.returnValue=false;

　　alert("出于版权考虑，网站禁止下载！");

　　}

　　}

　　</script>

　　2、隐藏video的控件

　　<style>

　　video {

　　max-width: 70%;

　　height: auto;

　　}

　　video::-webkit-media-controls,

　　video::-moz-media-controls,

　　video::-webkit-media-controls-enclosure{

　　display:none !important;

　　}

　　video::-webkit-media-controls-panel,

　　video::-webkit-media-controls-panel-container,

　　video::-webkit-media-controls-start-playback-button {

　　display:none !important;

　　-webkit-appearance: none;

　　}

　　</style>

　　【方法二】H5 Video 去除 下载按钮 禁用右键

　　<style type="text/css">

　　video::-webkit-media-controls-enclosure {

　　overflow:hidden;

　　}

　　video::-webkit-media-controls-panel {

　　width: calc(100% + 30px);

　　}

　　</style>

　　//去除右键事件

　　$("video").live("contextmenu",function(){//取消右键事件

　　return false;});

　　在使用HTML5做播放器的时候，很多人都觉得直接右键另存很不双，这里我们可以选择区域屏蔽右键，找到video标签，本身我们有下载功能，但是在video区域内，点击右键可以将“视频另存为”，来下载视频，为了屏蔽“视频另存为”，可以在js中加入以下代码：

　　$('#myVideo').bind('contextmenu',function() { return false; });

　　其中myVideo为video标签的id，这样就可以屏蔽video标签区域的右键功能，但是不能做到真正的屏蔽。要知道，最笨的方法人家也可以录屏把你的视频保存下来。所以，网页内部要实现防止人下载您的video视频只能是针对一些不太懂网页技术的用户。

声明：除非注明，本站内容由无锡网站建设马氪软件原创发布©，转载请联系我们授权合作。