Press "Enter" to skip to content

jQuery Enable Right-click Context Menu for Bootstrap

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.

jquery context menu, jquery datatable context menu example, bootstrap 3/4/5 context menu, jquery enable context menu, jquery context menu icons list

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 Bootstrap dropdown menu for 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
  
});

minimal context menu plugin for jquery ui, jquery bootstrap context menu Plugin/Github

Be First to Comment

    Leave a Reply

    Your email address will not be published.