HTML oncontextmenu Event Attribute

HTMLWeb DevelopmentFront End Technology

The HTML oncontextmenu event attribute is triggered when the user right clicks on an HTML element to open the context menu in an HTML document.

Syntax

Following is the syntax −

<tagname oncontextmenu=”script”></tagname>

Example

Let us see an example of HTML oncontextmenu event Attribute −

Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      color: #000;
      height: 100vh;
      background-color: #FBAB7E;
      background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);
      text-align: center;
      padding: 20px;
   }
   .box {
      background: #db133a;
      width: 140px;
      height: 140px;
      margin: 1rem auto;
      color: #fff;
   }
</style>
</head>
<body>
<h1>HTML oncontextmenu Event Attribute Demo</h1>
<p oncontextmenu="get()" class="box"></p>
<p>Now try to right click on above red box to open context menu.</p>
<script>
   function get() {
      document.body.style.background = "#084C61";
      document.body.style.color = '#fff';
}
</script>
</body>
</html>

Output

Now try to right click on the red box to observe how oncontextmenu event attribute work.

raja
Published on 24-Sep-2019 12:17:32
Advertisements