DOM event - ContextMenu / OnContextMenu

Devtool Chrome Event Listener

About

The contextmenu event is a pointerEvent that happens when the user tries to open the context menu (generally with right click)

Example

  • screenX : value based on the pointer position on the screen
  • screenY : value based on the pointer position on the screen
  • clientX : value based on the pointer position within the viewport
  • clientY : value based on the pointer position within the viewport
document.addEventListener("contextmenu", (e) => {
  const { clientX, clientY } = e;
  console.log(`You clicked at the client position x: ${clientX}, y: ${clientY}`);
  e.preventDefault()
});
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ipsum purus, bibendum sit amet vulputate eget, porta semper ligula. Donec bibendum vulputate erat, ac fringilla mi finibus nec. Donec ac dolor sed dolor porttitor blandit vel vel purus. Fusce vel malesuada ligula. Nam quis vehicula ante, eu finibus est. Proin ullamcorper fermentum orci, quis finibus massa. 
  • Result: Right click to see the position of the right click.





Discover More
Devtool Chrome Event Listener
DOM - Event Type (name)

An event is categorize by its type which is a property of the event object The type of an event is also known as the name of the event (Ref)...



Share this page:
Follow us:
Task Runner