As Adrian said, the plugins are going to work the same way. There are three basic parts you're going to need:
1: Event handler for 'contextmenu'
event:
$(document).bind("contextmenu", function(event) {
event.preventDefault();
$("<div class='custom-menu'>Custom menu</div>")
.appendTo("body")
.css({top: event.pageY + "px", left: event.pageX + "px"});
});
Here, you could bind the event handler to any selector that you want to show a menu for. I've chosen the entire document.
2: Event handler for 'click'
event (to close the custom menu):
$(document).bind("click", function(event) {
$("div.custom-menu").hide();
});
3: CSS to control the position of the menu:
.custom-menu {
z-index:1000;
position: absolute;
background-color:#C0C0C0;
border: 1px solid black;
padding: 2px;
}
The important thing with the CSS is to include the z-index
and position: absolute
It wouldn't be too tough to wrap all of this in a slick jQuery plugin.
You can see a simple demo here: http://jsfiddle.net/andrewwhitaker/fELma/