Swisnl Context menu theme

Question

I am using a jquery context menu plugin from github called Swisnl jQuery contextMenu

swisnl context menu documentation

The menu works well but I have noticed that themes don't seem to apply to it. I'd really like to use font awesome and have those icons use my jquery theme but if I can't do that then at least get the jquery ui icons working with it.

I created a fiddle that shows the menu not taking the theme 'le-frog'. The edit menu uses a jQuery icon while the other two menu items use fontAwesome just for demo purposes.

FIDDLE

HTML:

<div id='container'>
  <button id='clickMe' class="ui-button">
    Click
  </button>
</div>

jQuery:

$('#container').contextMenu({
  selector: ".ui-button",
  autoHide: true,
  trigger: "left",
  build: function($trigger, e) {
    return {
      items: {
        edit: {
          name: "Edit",
          icon: "ui-icon-pencil",
          callback: function(itemKey, opt) {

          }
        },
        remove: {
          name: "Delete",
          icon: "fa-trash",
          callback: function(itemKey, opt) {

          }
        },
        sep2: "---------",
        quit: {
          name: "Quit",
          icon: "fa-times",
          callback: function() {
            //empty callback closes context menu
          }
        }
      }
    }

  }
});

I did try to add classNames:{icon:'fa'} after the trigger: like so:

$('#container').contextMenu({
  selector: ".ui-button",
  autoHide: true,
  trigger: "left",
  classNames:{icon:'fa'},
  build: function($trigger, e) {
  ............

But that made the icons sit right next to the menu options instead of in their regular place and didn't seem to apply any themes anyway.

Any one have ideas on how to get the context menu to use my jQuery UI theme?

Answer 1

I'm sorry, but the menu does not support jQuery UI theming.