Disabling right click and popup window

user_1255576 0
Viewed 93

I want to disable right-click on an image. When a user right-clicks on an image, I want it to show a message (please run the code snippet below).

In the code below, I have two images. If I right-click on the top of the image, it pops up a window and says "Right click not allowed". However, if I scroll down and right-click on the image, this pop-up window shows up at the bottom of the website.

Can you please tell me how can I make this pop-up window open up at the place where I am right-clicking? (for example, if I right-click on the second image, this popup window doesn't even show up).

<script>
  if (document.getElementById('test1').addEventListener) {
    document.getElementById('test1').addEventListener('contextmenu', function(e) {
      $("#rmenu").toggleClass("hide");
      $("#rmenu").css({
        position: "fixed",
        top: e.pageY,
        left: e.pageX
      });
      e.preventDefault();
    }, false);
  }
  $(document).bind("click", function(event) {
    document.getElementById("rmenu").className = "hide";
  });
</script>

html jquery javascript
2 Answers

Indicate position: absolute instead of position: fixed. Here:

...
$("#rmenu").css({
  position: "absolute",
  top: e.pageY,
  left: e.pageX
});
...
user_135734440

Well i will suggest you to convert your images or whole HTML page into canvas.If the purpose is to hide code or not to download images.

user_128624500
Related