Introduction

In this article, we will see how to disable right-click option using a simple jQuery code. I hope you will like it.

Please see this article in my blog.

Background

Most developers are always looking for the safety of their images and code blocks that they have shared in the web. But normally it is hard to secure this unless you use a third-party tool. Some of us may think, if we just disable the right-click option in our page then that makes the content secured. But it is not. If someone really wants to get the contents from your page, they can do it. Even though that is the reality, I am sharing this article to show how to disable the right-click option in the page.

Using the code

We will use jQuery for this requirement. So you need to load the jQuery reference first.

  1. <script src="http://sibeeshpassion.com/content/scripts/jquery-1.11.1.min.js"></script>

Now we need to add the necessary scripts.

  1. <script>
  2. $(document).ready(function() {
  3. $(document).on("contextmenu",function(e){
  4. return false;
  5. });
  6. });
  7. </script>

Here what we did is, whenever the user tries to right-click in the document, we are preventing that. We are applying this restriction to the entire document. And we use the contextmenu event to do that.

That is all. Everything is done and set. Now you need to see the output and demo, right?

Demo

You can see a demo at Disable Right-click Option Demo.

You can see that the right-click option is not allowed in the demo page. You can always give an alert also, if a user does a right-click.

Conclusion

I hope you liked my article. Now please share with me your feedback. Thanks in advance.

Kindest Regards,
Sibeesh Venu