Windows Like Right Click Context Menu with jQuery
| File Size: | 25.5 KB |
|---|---|
| Views Total: | 1980 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
A lightweight jQuery context menu plugin that displays a Windows like popup menu with icons as you right click on a given container.
How to use it:
1. Load jQuery library together with the jquery.contextmenu.css and jquery.contextmenu.js in your Html page.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="jquery.contextmenu.js"></script> <link href="jquery.contextmenu.css" rel="stylesheet">
2. Call the plugin on where you wish to enable the context menu and create your own menu using items array. Icon needs to be 16x16px.
$('.something').contextPopup({
title: 'Some title',
items: [{
label:'Item #1',
icon:'icon1.png',
action:function() { alert('hi'); }
},{
label:'Item #2',
icon:'icon2.png',
action:function() { alert('yo');
},null, // divider {
label:'Item #3',
icon:'icon3.png',
action:function() { alert('bye'); },
isEnabled: function() { return false; }
},
]
});
3. The default settings.
$('.something').contextPopup({
contextMenuClass: 'contextMenuPlugin',
linkClickerClass: 'contextMenuLink',
gutterLineClass: 'gutterLine',
headerClass: 'header',
seperatorClass: 'divider',
title: '',
items: []
});
This awesome jQuery plugin is developed by joewalnes. For more Advanced Usages, please check the demo page or visit the official website.











