jquery 防止通过右键单击下载图像

czfnxgou  于 5个月前  发布在  jQuery
关注(0)|答案(4)|浏览(55)
  • 编辑:* 在回应许多评论,我知道,有没有肯定火的方式来完全保护图像被下载.这种方法是为了防止休闲用户从下载简单的右键单击.最好的方法可能是简单的版权保护您的图像,如果你是非常关心会使用像Digimarc数字水印您的图像服务.现在的问题:

我遇到一个网站,它使用GIF覆盖在他们的实际图像上,这样它就可以保护图像免受用户右键单击和下载图像(尽管你仍然可以从代码中获取实际图像)。他们使用的代码是:

<div><img src="-Transparent GIF File-" alt="" width="530" height="558" 
border="0" original="-Actual Image Displayed-" /></div>

字符串
我的问题是original标签是不是一个真实的标签,并使用和某种JavaScript翻译。我想在我的网站上复制这一点。有人能帮我找到这个脚本吗?

8fsztsew

8fsztsew1#

这是毫无意义的。如果浏览器显示一张图片,它可以被拍摄。任何试图阻止这一点的尝试都只是网站开销,可以非常容易地被绕过。
你最好的保护是在图片上贴上版权声明。
在任何情况下,如果你真的想交换original属性,你可以.

$(function() {
var o = $('img').attr('original');
$('img').attr('src', o);
});

字符串
Demo here
但是.这并不能阻止用户选择和保存与original属性绑定的图像。

zfciruhq

zfciruhq2#

一个更简单的解决方案是将所有这些属性添加到img标记中:

ondrag="return false"
ondragstart="return false"
oncontextmenu="return false"
galleryimg="no"
onmousedown="return false"

字符串
此外,要选择性地使图像打印更小,请将以下内容添加到img标记:

class="imgPrint"


并包含相关的CSS:

@media print
{
    .imgPrint
    {
        width: 40%;
    }
}

yeotifhr

yeotifhr3#

你也可以在没有原始标签的情况下这样做:
http://rainbow.arch.scriptmania.com/scripts/no_right_click.html
看这个链接。
我想这就是你想要的,这个链接可以帮助你。

u4vypkhs

u4vypkhs4#

这是我实现的一个图像的光保护。
它将在图像(或文本)上创建一个透明的封面DOM元素。如果您禁用JavaScript,则图像将被隐藏,如果您移除封面,则图像将在鼠标悬停时隐藏。此外,右键单击图像也将被禁用。
您可以随时打印屏幕,从下载的资源中抓取,等等。这将只过滤最基本的下载方式。但为了更方便的保护,您必须隐藏图像路径并渲染到画布对象。
你可以改善这一点,但总有一种方法来获得图像。

  • 在主要浏览器上测试并正常工作!*
    HTML格式
<div class="covered">
    <img src="image.jpg" alt="" />
</div>

字符串

酒店JavaScript + JQUERY

$('.covered').each( function () {

    $(this).append('<cover></cover>');
    $(this).mousedown(function(e){ 
        if( e.button == 2 ) { 
            e.preventDefault();

          return false; 
        } 
        return true;
    });

    $('img', this).css('display', 'block');

    $(this).hover(function(){
        var el = $('cover', this);
        if (el.length <= 0) { 
            $(this).html('');
        }
    });
});

CSS

cover
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.covered
{
    position: relative;
}

.covered img
{
    display: none;
}

相关问题