HTML - contextmenu

The contextmenu global attribute is the id of a <menu> to use as the contextual menu for this element.




<body contextmenu="share">
  <menu type="context" id="share">
    <menu label="share">
      <menuitem label="Twitter" onclick="shareViaTwitter()"></menuitem>
      <menuitem label="Facebook" onclick="shareViaFacebook()"></menuitem>
      Anywhere in the example you can share the page on Twitter and
      Facebook using the Share menu from your context menu.
    <li contextmenu="changeFont" id="fontSizing">
      On this specific list element, you can change the size of the text
      by using the "Increase/Decrease font" actions from your context menu
    <menu type="context" id="changeFont">
      <menuitem label="Increase Font" onclick="incFont()"></menuitem>
      <menuitem label="Decrease Font" onclick="decFont()"></menuitem>
    <li contextmenu="ChangeImage" id="changeImage">
      On the image below, you can fire the "Change Image" action
      in your Context Menu.<br />
      <img src=""
          contextmenu="ChangeImage" id="promoButton" />
      <menu type="context" id="ChangeImage">
        <menuitem label="Change Image" onclick="changeImage()"></menuitem>


function shareViaTwitter() {"" +
      "Hurray! I am learning ContextMenu from MDN via Mozilla");

function shareViaFacebook() {"" +

function incFont() {
  document.getElementById("fontSizing").style.fontSize = "larger";

function decFont() {
  document.getElementById("fontSizing").style.fontSize = "smaller";

function changeImage() {
  var index = Math.ceil(Math.random() * 39 + 1);
  document.images[0].src =
      "" +
      index + ".png";



The contextmenu global attribute is the id of a <menu> to use as the contextual menu for this element.

A context menu is a menu that appears upon user interaction, such as a right-click. HTML5 now allows us to customize this menu. Here are some implementation examples, including nested menus.

Browser Compatibility  

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support No support[1] 9 (9) No support No support[1] No support
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support No support No support 20 (20) No support No support ?

[1] An experimental implementation is available via the command line option --enable-blink-features=ContextMenu. Until Chrome 52 and Opera 39 it was additionally available by enabling the Experimental Web Platform features option, but got removed from that due to a Web compatibility issue. Support for this feature is requested in Chromium bug 87553.

See Also  


Specification Status Comment
WHATWG HTML Living Standard
The definition of 'contextmenu' in that specification.
Living Standard No change from latest snapshot, HTML5.1
The definition of 'contextmenu' in that specification.
Working Draft Snapshot of WHATWG HTML Living Standard, initial definition.


© 2016 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.

Global attributes HTML Reference