How To Post Pictures On A Website That Cannot Be Copied

[rvalkass 5]

1) Use a java applet to get the picture. They won't be able to see where the picture is and can only get the class, which shows no source code.

What about users who don't have Java installed, or block Java applets in web pages? Java is also, in my experience, one of the slowest things you cna add to a web page, and a cause of many hours of personal frustration and anger and the browser continually freezing.

2) Make it impossible to take a screenshot of it by overriding the clipboard when they press any key- Unfortunately, it only works for IE, but it's something.

No. No. No. Breaking the user experience in that way is a horrific thing to do to your users. Plus, it wouldn't work if the screenshot was taken by an external application. Plus, as you say that would only affect users of IE, who have a hard enough time as it is They certainly don't need to find out that people are messing around with their clipboard without their knowledge.

[web_designer 7]

i got another good option, a customizable photo gallery in flash and it is free it called dfgallery, here is the link

http://forums.xisto.com/no_longer_exists/

this gallery not allowed "save as image " option, i test it myself, but ofcourse they can always take a screen shoot but you can avoid that by adding a watermark over each image.

[mandla 0]

One an image is on your pc screen from the internet, then a copy of it will be in the temp internet files folder. So i think based on my level of knowledge the only way to put the image on line is to call it using flash. there is a way of calling an image in Javascript I think and display the image as flash. You can call the image as a flash slide show and just make it rotate the same picture twice to the ordinary viewer they wont see transitions cause the start and end product are the same but I think when they right click to save as even if they have the Enable right click script, they will only get that flash right click menu which says loop, rewind, pause etc other than that they sort of dont have access to the files themselves as they are downloaded as flash files and even if they were to view source the source file will not show the script that calles individual files but just a script that simingly opens a swf file. Hope this works for you

[dirty_keso 0]

anwii, as it was previously stated" by you seeing the image it has already been downloaded" hence there is no bullet proof form of keeping an image safe from the public. however, you can use other features to help prevent the exploitation of your work by random visitors to your website. one way is by disabling the right click feature as recommended by web_designer. another form of disabling this feature is by putting the images in a swf format. in order to do this easily you can download picasa then zenflash gallery template. all you have to do is add the template to the directory ( should look something like this: c:\program files\picasa2\website\template) then open up picasa, highlight the images you want and go to folder>export as html and follow the guide that will come after that you should choose zenflash when the webtemplate design come out. after you have created the html file you can integrate it into your webpage. this will give you a create design and protect your work from others.

[Ash-Bash 0]

Well this can be done by a script to stop a right click though a simple 'Print screen' button will get round this then you simply 'crop'.What I do to stop others using images of my graphics cards and PC's is add a faint copy right diagonally across the image. There is no way they will be able to get rid of this even if they try the image will look different and horrible.

[kobra500 1]

Here's the Deal, people who deny right clicking to users should not make websites, secondly, I could print screen you image or use keyboard shortcut's for content, if you don't want something to be stolen or used well then you will rather have to not put them on the internet, as soon as you upload them to where people can see them then you are automatically subject to the idea that it can be stolen. obviously copyright law makes this process illegal but it's impossible to make people want to visit your website whilst having right click block on.

Edited June 10, 2010 by kobra500 (see edit history)

[rougue 0]

badoo.com has the thing on their website, i've tried going through their code to see how they do it, i ddnt find it, ddnt look hard enough though, go over there you might get something. it does not beat the "save page as" option in explorer though! coz images are donwnloaded an placed in the source folder of the saved page! thats how i take e pics !!! it beats the other browsers though!! its the best i've seen! The only other way that works is to put the images in a flash script or animation, works best! but wont stop users from pushing the <print screen> key!! I have a theory on how to solve the problem, though, i have never tried it, maybe you, pls let me know if you do...

you put all your images in a database (say mysql), and call them out with a java applet (or maybe jsp and servlet) and make sure the link to the picture file itself is encapsulated or encrypted. Your code can then also be used to read and detect what keys are pushed from the keyboard eg (pseudocode)

BEGIN

 

COMMENT: // KEYS: 32 == ctrl, 64 == PrintScreen, 56 == c

 

INTEGER key1, key2, key3;

 

BOOLEAN pressed = TRUE;

 

IF ((key1 = 32) == pressed) OR (((key1 = 32) AND (key2 = 64)) == pressed) OR (((key1 = 32) AND (key3 = 56)) == pressed))

 

THEN DISPLAY "image copy not allowed"

END IF;

 

END

 

 

In theory, the code can be written to interect with the browser to even block the "Save page option", note i said IN THEORY!

Bichi part is, i dont think it'll work if the browser window is not selected! Edited June 17, 2010 by rougue (see edit history)

[web_designer 7]

badoo.com has the thing on their website, i've tried going through their code to see how they do it, i ddnt find it, ddnt look hard enough though, go over there you might get something. it does not beat the "save page as" option in explorer though! coz images are donwnloaded an placed in the source folder of the saved page! thats how i take e pics     !!! it beats the other browsers though!! its the best i've seen!  The only other way that works is to put the images in a flash script or animation, works best! but wont stop users from pushing the <print screen> key!!  I have a theory on how to solve the problem, though, i have never tried it, maybe you, pls let me know if you do...  

you put all your images in a database (say mysql), and call them out with a java applet (or maybe jsp and servlet) and make sure the link to the picture file itself is encapsulated or encrypted. Your code can then also be used to read and detect what keys are pushed from the keyboard eg (pseudocode)

BEGIN  

 

COMMENT:  // KEYS:  32 == ctrl, 64 == PrintScreen,  56  == c  

 

INTEGER key1, key2, key3;  

 

BOOLEAN pressed = TRUE;  

 

IF ((key1 = 32) == pressed) OR (((key1 = 32) AND (key2 = 64)) == pressed) OR (((key1 = 32) AND (key3 = 56)) == pressed))  

 

THEN DISPLAY    "image copy not allowed"  

END IF;  

 

END  

 

 

In theory, the code can be written to interect with the browser to even block the "Save page option", note i said IN THEORY!  

Bichi part is, i dont think it'll work if the browser window is not selected!

 

it is an interesting theory rougue, and looks reasonable an make sense. but i really think you should test it before post it here to give us the results you get. anyway, it seems good but it covers only keyboard button, how about the mouse?

or laptop touch pad? i really want to hear your opinion about them.

 

and between: most sites use java script to avoid coping images from their sites.

[iGuest 3]

some nice methods above,
two more methods:
1.
place a transparent png/gif (ex. size: 5px x 5px) over the top of your image,
the user then saves the duff image instead of the one you're trying to protect.
hopefully they will have left your page before they realise they got a duff!
2a.
another method is using css to do the same,
then instad of getting an image to save, when they right click to save they get the html instead.
try this out.
have a look-see
http://forums.xisto.com/no_longer_exists/
you'll see that even when viewing the source the picture url is not showing.
NB: the css should go in a separate file, this means they have to download and view the css first to get the url,
not fool proof but it does add inconvenience
2b.
also, chop the image up ~ the 2nd example displays the image in four pieces
again not fool proof but it does add inconvenience

=
here's the code, just change the urls and file names to suit your needs

the html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url="http://forums.xisto.com/no_longer_exists/ xmlns="[url="http://forums.xisto.com/no_longer_exists/ http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>securePics</title><link rel="stylesheet" type="text/css" href="securePics.css" /></head><body><!-- BOF 1ST EXAMPLE NOT USING CSS --><table style="display: inline;" border="0" cellspacing="0" cellpadding="0"><tbody><tr height="360"><td style="background-image: url(XXX_TROG-HAT_4994_aems_T.png);" width="360"> <img title="TROG-HAT" src="5345_534_590.png" alt="" width="360" height="360" /> </td></tr></tbody></table><!-- EOF 1ST EXAMPLE NOT USING CSS --><!-- BOF 2ND EXAMPLE USING CSS AND CHOPPED METHOD--><table style="display: inline;" border="0" cellspacing="0" cellpadding="0"><tbody><tr height="150"><td class="hidenpic1" width="150"><div class="hidepic1"></div></td><td class="hidenpic2" width="150"><div class="hidepic2"></div></td></tr><tr height="150"><td class="hidenpic3" width="150"><div class="hidepic3"></div></td><td class="hidenpic4" width="150"><div class="hidepic4"></div></td></tr></tbody></table><!-- EOF 2ND EXAMPLE USING CSS AND CHOPPED METHOD--></body></html>

the css

@charset "utf-8";/* CSS Document */body{background-color: transparent;background-image: url('bgr.gif');background-repeat: repeat-x;background-attachment: fixed;}.hidepic1,.hidepic2,.hidepic3,.hidepic4{border:none;background-image: url(5345_534_590.png);background-repeat:repeat;width:180px;height:180px;}.hidenpic1{background-image: url(XXX_TROG-HAT_4994_aems_T1.png);}.hidenpic2{background-image: url(XXX_TROG-HAT_4994_aems_T2.png);}.hidenpic3{background-image: url(XXX_TROG-HAT_4994_aems_T3.png);}.hidenpic4{background-image: url(XXX_TROG-HAT_4994_aems_T4.png);}.hidenpic1,.hidenpic2,.hidenpic3,.hidenpic4{border:none;}

[lovelopez 0]

I've seen some websites that have a photo gallery on the site, but don't allow users to download the photos, but I'm not sure how they do this. Clicking on the picture brings up a "gallery" of photos, but they cannot download from that screen (or the earlier screen). Does anyone know how this works?They do it with Flash photo galleries. But you can still take a screenshot of anything that appears on your screen, so it's basically impossible to show someone an image via the internet but prevent them from copying it.If you are concerned about users taking your images, you should probably add a watermark and copyright notice to each one. At least then, no one can claim that they thought the image was public domain.If you really have to, put a watermark on it. If you want people to see it, they're already downloading the photo.Viewing photos on a webpage *is* downloading them. All you can do is make it hard for unsophisticated users to save them. Anybody with half a clue will just press the print screen button and paste it into paint or photoshop.How does Flickr do it? Even if you disable Flash, right-clicking a photo does not give Save Image or Save Background Image options It looks like they are just using a standard img tag so I assume it's some fancy CSS or Javascript around it.

Edited March 22, 2013 by velma (see edit history)

[iGuest 3]

the title pretty much explains my question. this isn't a tutorial on how to do it. i actually want to know HOW to do it. i have some interesting pictures. i know if i post them on my site, they are going to be copied so i want a way to post them without any way that someone can copy them. how does one do this?i want a secure way of protecting the pictures so please don't tell me to disable the right click button as any fool can bypass that.