Вроде так работает.
jQuery.fn.contextPopup = function(menuData) {
var amenu = null;
var bg = null;
// Define default settings
var settings = {
contextMenuClass: 'contextMenuPlugin',
linkClickerClass: 'contextMenuLink',
gutterLineClass: 'gutterLine',
headerClass: 'header',
seperatorClass: 'divider',
posleft:0,
postop:0,
title: '',
items: [],
};
// merge them
$.extend(settings, menuData);
// Build popup menu HTML
function createMenu(e) {
if (amenu) return amenu;
var menu = $('<ul class="' + settings.contextMenuClass + '"><div class="' + settings.gutterLineClass + '"></div></ul>')
.appendTo(document.body);
if (settings.title) {
$('<li class="' + settings.headerClass + '"></li>').text(settings.title).appendTo(menu);
}
settings.items.forEach(function(item) {
if (item) {
var rowCode = '<li><a href="#" class="'+settings.linkClickerClass+'"><span class="itemTitle"></span></a></li>';
// if(item.icon)
// rowCode += '<img>';
// rowCode += '<span></span></a></li>';
var row = $(rowCode).appendTo(menu);
if(item.icon){
var icon = $('<img>');
icon.attr('src', item.icon);
icon.insertBefore(row.find('.itemTitle'));
}
row.find('.itemTitle').text(item.label);
if (item.isEnabled != undefined && !item.isEnabled()) {
row.addClass('disabled');
} else if (item.action) {
row.find('.'+settings.linkClickerClass).click(function () { item.action(e); });
}
} else {
$('<li class="' + settings.seperatorClass + '"></li>').appendTo(menu);
}
});
menu.find('.' + settings.headerClass ).text(settings.title);
return menu;
}
// On contextmenu event (right click)
this.on('contextmenu', function(e) {
if (bg) bg.remove();
if (amenu) amenu.remove();
if (!amenu) {amenu = createMenu(e).show(); }
else
return false;
var left = e.pageX + 5, /* nudge to the right, so the pointer is covering the title */
top = e.pageY;
if (top + amenu.height() >= $(window).height()) {
top -= amenu.height();
}
if (left + amenu.width() >= $(window).width()) {
left -= amenu.width();
}
if (settings.posleft > 0)
left = settings.posleft;
if (settings.postop>0)
top = settings.postop;
// Create and show menu
amenu.css({zIndex:1000001, left:left, top:top})
.on('contextmenu', function() { return false; });
// Cover rest of page with invisible div that when clicked will cancel the popup.
if (!bg)
bg = $('<div></div>')
.css({left:0, top:0, width:'100%', height:'100%', position:'absolute', zIndex:1000000})
.appendTo(document.body)
.on('contextmenu click', function() {
// If click or right click anywhere else on page: remove clean up.
if (bg)
bg.remove();
if (amenu)
amenu.remove();
return false;
});
// When clicking on a link in menu: clean up (in addition to handlers on link already)
amenu.find('a').click(function()
{
bg.remove();
amenu.remove();
// bg = null;
// amenu = null;
}
);
// Cancel event, so real browser popup doesn't appear.
return false;
});
return this;
};