경고: contextmenu 특성은 폐기되었으며, 모든 브라우저에서 제거될 것입니다.

contextmenu 전역 특성은 이 요소의 컨텍스트 메뉴로 사용될 <menu> (en-US)id입니다.

컨텍스트 메뉴는 마우스의 우클릭(right-click)과 같은 사용자 상호작용 중에 나타나는 메뉴를 말합니다. HTML5에서는 이 메뉴를 커스터마이징할 수 있습니다. 다음은 계층 메뉴(nested menu)를 포함한 구현 예제입니다.



<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 />
        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 +



No specification found

No specification data found for html.global_attributes.contextmenu.
Check for problems with this page or contribute a missing spec_url to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

브라우저 호환성

BCD tables only load in the browser

See also