bootstrap-contextmenu is a small, lightweight, right-click context menu for jQuery/Bootstrap without all the unnecessary features. The minified version is only 554 bytes in size.

It also allows you to show other elements like div or iframe with right-click.

Must Read: A Simple Vue Context Menu Component Javascript Library

How to make use of it:

1. Include the jQuery Bootstrap Contextmenu plugin in your Bootstrap project.

<script src="jquery-2.1.4.min.js"></script>
<link rel="stylesheet" href="bootstrap.min.css">
<script src="bootstrap.min.js"></script>

<script src="jquery.context.min.js"></script>

2. Create a Bootstrap dropdown menu for the context menu.

<ul class="dropdown-menu" id="demo">
  <li><a href="#">Action 1</a></li>
  <li><a href="#">Action 2</a></li>
  <li><a href="#">Action 3</a></li>
</ul>

3. Configure the plugin to enable the “#demo” context menu inside the “#wrapper” container.

$('#wrapper').contextmenu('#demo', function(clicked, selected) {

  // callback function
  
});

See Also –

Custom Right-Click Context Menu With HTML and JavaScript
Simple To Use Context Menu Plugin for Angular | ng-simple-contextmenu
A JavaScript Library for Adding Context Menus to Any HTML Element | context-menu.js

See Demo And Download

Official Website(jochemstoel): Click Here

This superior jQuery/javascript plugin is developed by jochemstoel. For extra advanced usage, please go to the official website.