Simple Dynamic Context Menu In jQuery

File Size: 39.6 KB
Views Total: 1828
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Simple Dynamic Context Menu In jQuery

The jQuery Simple Context Menu plugin lets you create a fancy, interactive, custom context menu that can help make your user experience stand out from the crowd.

The context menu gets items dynamically from a JS array and displays them in a floating window when right-clicking the target element without interfering with the rest of the page's content. 

See Also:

How to use it:

1. Download and load the simple-context-menu.min.js script after jQuery library.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/dist/js/simple-context-menu.min.js"></script>

2. Call the function on the target element in which the custom context menu should appear and define your menu items in the options array.

<div class="example">
  Right Click Me
  options: [
      label: "Facebook",
      // use Font Awesome Iconic Font
      icon: '<i class="fa fa-facebook"></i>',
      action: () => console.log("Facebook"),
      label: "Twitter",
      // use PNG
      icon: '<img src="twitter.png">',
      action: () => console.log("Twitter"),
    // ...

3. Apply additional CSS class(es) to the context menu.

  class: 'myClass1 myClass2'

4. Callback functions available.

  onShow: function () {
  onHide: function () {

About Author:

Author: Md.Harun-Ur-Rashid


This awesome jQuery plugin is developed by haruncpi. For more Advanced Usages, please check the demo page or visit the official website.