Source Code: (back to article)
<div id="contextArea" style="width: 300px; height: 200px; background-color: #f0f0f0; margin-bottom: 10px;">
Right-click on me
</div>
<ul id="customMenu" style="display: none; list-style: none; padding: 10px; background-color: white; border: 1px solid black; position: absolute;">
<li>Option 1</li>
<li>Option 2</li>
<li>Option 3</li>
</ul>

<script>
document.getElementById('contextArea').addEventListener('contextmenu', function(event) {
event.preventDefault(); // Prevent the default context menu
var menu = document.getElementById('customMenu');
menu.style.display = 'block';
menu.style.left = event.pageX + 'px';
menu.style.top = event.pageY + 'px';
});

document.addEventListener('click', function(event) {
document.getElementById('customMenu').style.display = 'none';
});
</script>