How do I disable right click to download images in JavaScript?

Question

The expected behavior is:

When the user right-clicks on "Images ONLY" a Copyright statement is shown.
If the user selects to suppress alert messages from the webpage, the context-menu to save the image still does not appear.
Works across "ALL" Web browsers (Incl. IE 8+, Opera, Google Chrome, Apple Safari, & Mozilla Firefox).
I want to be able to put this code in its own ".js" file, by the name image_norightclick.js.

Code:

var message="Copyright \u00A9 2015 [YOUR NAME HERE]";

function disableClick(e) {

  if (document.all) {
    if (((event.button == 2) || (event.button == 3)) && ((event.srcElement.tagName == "IMG") || (event.srcElement.getAttribute("type").toUpperCase() == "IMAGE"))) {
      if (event.srcElement.oncontextmenu) {
        event.srcElement.oncontextmenu = function(event) {
          if (event.preventDefault) {
            event.preventDefault();
          };
          if (event.stopPropagation) {
            event.stopPropagation();
          };
          if (event.returnValue) {
            event.returnValue = false;
          };
        };
      } else {

        if (event.srcElement.addEventListener) {
          event.srcElement.addEventListener("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }

          );
        } else if (event.srcElement.attachEvent) {
          event.srcElement.attachEvent("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }

          );
        };

      };

      alert(message);
      return false;
    };
  } else if (document.layers) {
    if ((e.which == 2) || (e.which == 3)) {

      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {

        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }

          );
        };


      };


      alert(message);
      return false;
    };
  } else if (document.getElementById)

  {
    if (((e.which == 2) || (e.which == 3)) && ((e.target.tagName == "IMG") || (e.target.getAttribute("type") && e.target.getAttribute("type").toUpperCase() == "IMAGE"))) {


      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {
        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }

          );
        };


      };


      alert(message);
      return false;

    };
  };

};

function associateImages() {
  for (i = 0; i < document.images.length; i++) {
    document.images[i].onmousedown = disableClick;
  };

};

if (document.all) {
  if (document.onmouseup) {
    document.onmouseup = disableClick;
  } else {
    window.onmouseup = disableClick;
  };

} else if (document.getElementById) {
  if (document.onmousedown) {
    document.onmousedown = disableClick;
  } else {
    window.onmousedown = disableClick;
  };

} else if (document.layers) {
  associateImages();
};

There is a lot of code here; it would be helpful if we had an idea of what you mean when you say it doesn't work.... — Claies, Mar 11 '15 at 00:08
Two issues with this question that keep it from being viable for Stack Overflow 1) You haven't given us any error messages or what happens when you run this code. What error do you see from the console? Edit that into your question. 2) You dumped all the code on us instead of focusing on a particular piece of code. in this case; the right click. — George Stocker, Mar 11 '15 at 12:31
This simply is useless in javascript as 1) Javascript can be disabled 2) viewing an image is actually downloading it 3) Anyone could see the direct URL of an image and download it anyway. The only viable access restriction that could occur would be server-side. — Laurent S., Mar 11 '15 at 12:37
No, George, You edited the question title to a very dumbed down unrelated question, that _YOU_ thought made more sense (with my name attached to it, as if I were that retarded), and you removed part of the code that made it all work. Also, the minute you got a hold of this question it has turned into a schizophrenic mess! — James Anderson Jr., Mar 11 '15 at 12:50
@JamesAndersonJr. You're right; I removed a line. Edited it back in. Thanks for catching that! — George Stocker, Mar 11 '15 at 12:54
@GeorgeStocker Also your "related" question, clearly states "without using JavaScript" and is nowhere near the same issue this question addressed. Please, just go away. — James Anderson Jr., Mar 11 '15 at 12:56
@GeorgeStocker If you don't understand a question or conversation, that's probably a good indication that you should leave the moderation to another moderator, or admin. Instead of forcing the question into a format only _YOU_ understand, then claiming it's a duplicate of another. That, to me, is pathetic. My post has garnered more down votes since you edited than the entire time it was posted the right (original) way. It is a Perfect "No Right-Click on Images" JavaScript, with no JQuery. Not a perfect "Protect Images from Download" script. — James Anderson Jr., Mar 11 '15 at 16:59
@JamesAndersonJr. even if it isn't a duplicate of that; it is a duplicate of: http://stackoverflow.com/questions/24020321/how-to-disable-save-image-as-option-on-right-click — George Stocker, Mar 11 '15 at 17:28

score 3 · Accepted Answer · edited Mar 11 '15 at 12:33

What's up with new Function(){}? It simply needs to be function(){}.

And you need to define your var message at the top:

var message = 'Your message here.';

Here's the working code:

function disableClick(e) {
  var message = 'WOULD YOU STEAL A CAR?';
  if (document.all) {
    if (((event.button == 2) || (event.button == 3)) && ((event.srcElement.tagName == "IMG") || (event.srcElement.getAttribute("type").toUpperCase() == "IMAGE"))) {
      if (event.srcElement.oncontextmenu) {
        event.srcElement.oncontextmenu = function(event) {
          if (event.preventDefault) {
            event.preventDefault();
          };
          if (event.stopPropagation) {
            event.stopPropagation();
          };
          if (event.returnValue) {
            event.returnValue = false;
          };
        };
      } else {

        if (event.srcElement.addEventListener) {
          event.srcElement.addEventListener("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }

          );
        } else if (event.srcElement.attachEvent) {
          event.srcElement.attachEvent("contextmenu", function(event) {
              if (event.preventDefault) {
                event.preventDefault();
              };
              if (event.stopPropagation) {
                event.stopPropagation();
              };
              if (event.returnValue) {
                event.returnValue = false;
              };
            }

          );
        };

      };

      alert(message);
      return false;
    };
  } else if (document.layers)

  {
    if ((e.which == 2) || (e.which == 3)) {

      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {

        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }

          );
        };


      };


      alert(message);
      return false;
    };
  } else if (document.getElementById)

  {
    if (((e.which == 2) || (e.which == 3)) && ((e.target.tagName == "IMG") || (e.target.getAttribute("type") && e.target.getAttribute("type").toUpperCase() == "IMAGE"))) {

      if (e.target.oncontextmenu) {
        e.target.oncontextmenu = function(e) {
          if (e.preventDefault) {
            e.preventDefault();
          };
          if (e.stopPropagation) {
            e.stopPropagation();
          };
          if (e.returnValue) {
            e.returnValue = false;
          };
        };
      } else {

        if (e.target.addEventListener) {
          e.target.addEventListener("contextmenu", function(e) {
              if (e.preventDefault) {
                e.preventDefault();
              };
              if (e.stopPropagation) {
                e.stopPropagation();
              };
              if (e.returnValue) {
                e.returnValue = false;
              };
            }

          );
        };


      };


      alert(message);
      return false;

    };
  };

};

function associateImages() {
  for (i = 0; i < document.images.length; i++) {
    document.images[i].onmousedown = disableClick;
  };

};

if (document.all) {
  if (document.onmouseup) {
    document.onmouseup = disableClick;
  } else {
    window.onmouseup = disableClick;
  };

} else if (document.getElementById) {
  if (document.onmousedown) {
    document.onmousedown = disableClick;
  } else {
    window.onmousedown = disableClick;
  };

} else if (document.layers) {
  associateImages();
};

/* This is the actual "No Right-Click on Images" script [ABOVE]. DO NOT EDIT [ABOVE] THIS LINE [END] */

JS Fiddle Demo

[Stolen car is here](http://i.ytimg.com/vi/mSFTRoBY99s/hqdefault.jpg). — showdev, Mar 11 '15 at 00:20
@zerkms, probably a mere screenshot. The code is bullet-proof. — James Anderson Jr., Mar 11 '15 at 00:46
@blex Please, Ignore George! JS Fiddle has been used on Stack for years. Where did this guy come from? — James Anderson Jr., Mar 11 '15 at 12:52
@JamesAndersonJr. Has been used; yes. But JSFiddle has *never* been allowable as the only source of code. JSFiddle goes down a lot. Also, see the following meta posts from years ago where we talked about it: http://meta.stackexchange.com/questions/149890/prevent-posts-with-links-to-jsfiddle-and-no-code http://meta.stackoverflow.com/questions/274664/links-to-jsfiddle-net-must-be-accompanied-by-code-when-code-is-added-through-t http://meta.stackexchange.com/questions/84342/answer-that-only-contains-a-link-to-jsfiddle — George Stocker, Mar 11 '15 at 12:57

How do I disable right click to download images in JavaScript?

Code:

1 Answers1

JS Fiddle Demo