8

I have a canvas and I display an image inside it. I have attached a jquery event to it, like this:

$("#mycanvas").mousedown(function(e) {
    //Do something
    e.preventDefault();
    e.stopPropagation();
});

I would expect this code to do my operations and to prevent default browser behavior. The former is fulfilled, however, the latter, namely, default behavior prevention does not happen. The event runs though. I wonder how could I prevent showing that menu you can see on the image upon right-click:

enter image description here

Lajos Arpad
  • 64,414
  • 37
  • 100
  • 175
  • 2
    Be aware that while preventing right click will stop the context menu appearing, I can still see the URL to the image and download it through the DOM viewer/dev tools. The old adage applies - if it's viewable online, anyone can take it. – Rory McCrossan Jul 28 '16 at 08:30
  • @RoryMcCrossan, that's ok, I just want the user not to see that menu, everything else is nice. – Lajos Arpad Jul 28 '16 at 08:32
  • Possible duplicate? http://stackoverflow.com/questions/4920221/jquery-js-prevent-right-click-menu-in-browsers – Whothehellisthat Jul 28 '16 at 08:36

1 Answers1

12

You can use contextmenu:

$("#mycanvas").contextmenu(function(e) {
    //Do something
    e.preventDefault();
    e.stopPropagation();
});
Bhojendra Rauniyar
  • 83,432
  • 35
  • 168
  • 231