Jason 14


I'm pretty much against restricting users from right-clicking pages, but recently it's come to my attention that an old logo has been used somewhere else. So, I would like to stop the user from right-clicking on my logo.

Is there anyway I can go about this, or do right-click tricks just block the user from clicking everywhere only?


3 answers

danwellman 5600

There is no safe way to do this - Jens' solution is ok, but what happens when the visitor installs the web developer toolbar and chooses 'disable CSS'?

You can use elaborate JS methods to stop the right-click event in the browser...but then all that needs to be done is for JS to be disabled on the client. (And these right-click preventing techniques don't work in opera anyway)

Even if the logo is successfully blocked with clever CSS and/or JS, all the visitor has to do is hit Print Screen and then crop the logo out using any image editor.

If it's visible, and it's on the net, someone can take it.

The best thing to do is use a combination or techniques to make copying the logo successfully such a painfully tedious process that no one can be bothered to do it! use the CSS method advised by Jens as well as blocking right-clicks with JS. Also, as an extra layer of JS protection, disable right-clicks, but also, add the image using JS instead of having it as an <img> so at least if someone disables JS the image won't be on the page anyway. Watermark the image too if you can.

Is your logo/company name trademarked? if someone is using your logo illegally you could try a letter advising that they are liable to be sued if they continue using it...

Answered over 8 years ago by danwellman
  • I strongly agree with Dan. Most (if not all other) tricks can only deter general users, not those who are technically capable enough to pry open the loop holes. Even if a method works 'perfectly', we can't disable the ultimate mean which is to use screen capture. o.k.w over 8 years ago

Messing with a user's browser's expected default behavior is never a good idea in my opinion. The only way to keep somebody from who is determined to steal your image from doing so is to not put the image online.

Dan's advice is correct. Do you have a copyright? Send a cease and desist letter to the offender.



Answered over 8 years ago by Dwayne Anderson

Do you want to restrict the user from downloading the image?

If so use this:


<div class="restricted">
    <image /> <!-- -Your image here -->
     <p class="blocker"><span>You are not allowed to download this image.</span></p>

The CSS:

.restricted {position: relative;}

.restricted .blocker {
    position: absolute;
    top: 0;
    left: 0;
   width: 100%; 
  height: 100%;
.restricted .blocker span {
   position: absolute;
  left: -10000px;

This method puts the paragraph-element in front of the image element, thus making right click download harder. The span-element contains the legal text for non sighted users and search engines.

You could also use JavaScript to dynamically add these elements to say... every image with a class-attribute of "restricted". Alltough you should keep the CSS that handles the magic in a separate style sheet as usual.

Answered over 8 years ago by Jens Hedqvist