How to Disable Right Click Menu using JQuery with Example

Posted by

Introduction

Have you ever wondered how to prevent users from right-clicking on your website? In this article, we will explore the use of JQuery to disable the right-click menu. With a few lines of code, you can protect your content and enhance the user experience.

Why Disable Right Click?

Disabling the right-click menu can be useful in various scenarios. It can prevent users from copying your images, downloading your content, or accessing certain functionalities. By disabling the right-click menu, you have more control over how users interact with your website.

Getting Started

To disable the right-click menu using JQuery, you need to follow these steps:

Step:- Create HTML page

<html lang="en">
<head>
  <title>Jquery - disable right click on div using context menu </title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
</head>
<body>


<div class="container">
	<div class="my-div" style="width:500px;height:500px;background:blue"></div>
</div>


<script type="text/javascript">
	$(document).ready(function() {
	    $(".my-div").on("contextmenu",function(){
	       return false;
	    }); 
	});
</script>


</body>
</html>

Output:-
On the container right-click not working.

Hopefully, It will help you..!!!

Subscribe
Notify of
guest
0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x