jQuery Right-click Menu Plugin - ContextMenu
File Size: | 4.63 KB |
---|---|
Views Total: | 5531 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

ContextMenu is a lightweight jQuery plugin that lets you selectively override the browser's right-click menu with a custom one of your own.
Features:
- Use multiple menus on one page
- Menus can be bound to multiple elements
- Fully stylable
- Assign context-sensitive callbacks
Usage:
1. Add jQuery Library and ContextMenu.js into your head section
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script src="jquery.contextmenu.min.js" type="text/javascript"></script>
2. Call the plugin
<script type="text/javascript"> $(document).ready(function() { $('span.demo1').contextMenu('myMenu1', { bindings: { 'open': function(t) { alert('Trigger was '+t.id+'\nAction was Open'); }, 'email': function(t) { alert('Trigger was '+t.id+'\nAction was Email'); }, 'save': function(t) { alert('Trigger was '+t.id+'\nAction was Save'); }, 'delete': function(t) { alert('Trigger was '+t.id+'\nAction was Delete'); } } }); });
3. Markup
<div class="contextMenu" id="myMenu1"> <ul> <li id="open"><img src="folder.png" /> Open</li> <li id="email"><img src="email.png" /> Email</li> <li id="save"><img src="disk.png" /> Save</li> <li id="delete"><img src="cross.png" /> Delete</li> </ul> </div> <span class="demo1" id="quickDemo" style="border: 1px solid #888;"> <b>jQueryScript.Net Demo</b> right-click me!! </span>
This awesome jQuery plugin is developed by trendskitchens. For more Advanced Usages, please check the demo page or visit the official website.