Styleable context menu in pure JS (no jQuery).
justContext is a simple context menu plugin that doesn't require jQuery, but kicks ass anyway. Here are some of the features:
justContext.js is featured at Unheap and cssscript.com.
Including
Styling
<p class="jctx-host jctx-id-foo">Right-click this</p>
jctx-host
marks a hosting element. foo
is the unique ID for this menu.
Creating
<ul class="jctx jctx-id-foo jctx-black jctx-black-shadow">
<li data-action="cut">Cut</li>
<li data-action="copy">Copy</li>
<li data-action="paste">Paste</li>
<hr>
<li data-action="new_pkg">New package</li>
<li data-action="new_cls">New class</li>
<li data-action="new_intf" class="disabled">New interface (a disabled entry)</li>
</ul>
The jctx
styles and hides the menu. The unique ID is re-used here to identify the parent. The data-action
attribute of each menu entry is the string that is passed to the action handler when an entry is pressed.
Action Handling
<!-- Defining a sample action handler (for all menus) -->
<script>
function handleMenuAction(evt) {
alert("Action required: " + evt);
}
</script>