HTML oncontextmenu attribute

HTML oncontextmenu attribute: The HTML oncontextmenu attribute can be used when the user right-clicks on an element to open the context menu. And the HTML4 does not support the oncontextmenu attribute.

HTML oncontextmenu attribute

This attribute can be supported by all the elements. And it is a part of the event attribute.

Syntax: <element oncontextmenu = “script”>

Browser Support

This attribute was supported by different attributes.

Chrome
Firefox
InternetExplorer
Safari
Opera

Example:

<!DOCTYPE html>
<html>
<head>
<style>
div {
  background: yellow;
  border: 1px solid black;
  padding: 10px;
}
</style>
</head>
<body>

<div oncontextmenu="myFunction()" contextmenu="mymenu">
<p>Right-click inside this box to see the context menu!

<menu type="context" id="mymenu">
  <menuitem label="Refresh" onclick="window.location.reload();" icon="ico_reload.png"></menuitem>
  <menu label="Share on...">
    <menuitem label="Twitter" icon="ico_twitter.png" onclick="window.open('//twitter.com/intent/tweet?text=' + window.location.href);"></menuitem>
    <menuitem label="Facebook" icon="ico_facebook.png" onclick="window.open('//facebook.com/sharer/sharer.php?u=' + window.location.href);"></menuitem>
  </menu>
  <menuitem label="Email This Page" onclick="window.location='mailto:?body='+window.location.href;"></menuitem>
</menu>

</div>

<p><strong>Note:</strong> The contextmenu <strong>attribute</strong> only works in Firefox!</p>

<script>
function myFunction() {
  alert("You right-clicked inside the div!");
}
</script>

</body>
</html>

Output:

html oncontextmenu attribute