I found a website that disables right-click functionality, making it impossible to right-click anywhere on the page. I'm interested in implementing this feature on my own site as I'm still learning website development. I suspect this is done primarily to prevent users from inspecting the site or copying images. Here's an example of a site that does this: https://www.saatchiart.com/art/Painting-Parsing-Bill/488702/12801699/view. Can anyone provide guidance on how to do this?
3 Answers
Disabling right-click won't really protect your content. People can still copy images using the developer tools or by using keyboard shortcuts. Plus, blocking this feature only annoys users who might be trying to do legitimate things like opening links in new tabs. Consider offering quality content instead of trying to lock it down!
In practice, you can disable the right-click by adding an event listener for the context menu, like this:
document.addEventListener("contextmenu", event => event.preventDefault()); However, remember, this won't stop someone who really wants your content! It might just lead to a bad user experience without offering any real protection.
It's technically straightforward to disable right-click on your site using JavaScript, but it's really not a good idea. Users can easily bypass it, and it frustrates those visiting your site. For instance, simply hitting F12 can open developer tools, and preventing right-click can create accessibility issues for many users. Just a heads up!
Yeah, I tried that on my site, and it ended up frustrating users regardless of my intentions!