Here are couple of ways I use to do that but there are many different ways to do the same.
Disable right-clicks on images
To disable right clicks on images, we can make use of .contextmenu() event. You can right click but it won’t show you the context menu.
This event binds an event handler to “contextmenu” JavaScript event. You can use this to trigger that event on an element as well.
When you right click on an element, the contextmenu event is sent to the element before the context menu is displayed.
Here’s how to do it:
This will disable right click on all images. If you just want to disable right click on a specific image, just change the selector.
Disable dragging of images
We can make use of .mousedown() event to disable dragging of images.
This event binds an event handler to “mousedown” JavaScript event. You can use this to trigger that event on an element as well.
When you bring the mouse pointer over any element and the mouse button is pressed, the mousedown event is sent to an element.
In the example above, you still can drag the image but can’t right click on it. (You can right click but it won’t show you the context menu.)
In the same example, let’s add the code to disable dragging of images.
This will disable dragging of all images. If you just want to disable dragging of a specific image, just change the selector.
click disable images onclick
