Показать сообщение отдельно
  #6 (permalink)  
Старый 24.05.2016, 16:48
Интересующийся
Отправить личное сообщение для diprom Посмотреть профиль Найти все сообщения от diprom
 
Регистрация: 21.05.2011
Сообщений: 24

Вроде так работает.

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;
};
Ответить с цитированием