Firefox addon: adding an icon to the context menu

I am trying to create a firefox addon and I want to add an image / icon to the right-click context menu, for example, firebug had an icon in the right-click context menu,

enter image description here

I want to do something like this, my addon also consists of menu items

the structure of my addon in the context menu :

[icon] [menu] [menu item 1] [menu item 2] [menu item 3] [menu item 4] 

How can i do this?

+7
javascript firefox firefox-addon xul
source share
2 answers

You need to set the image attribute, give the class menu-iconic element and save the image so that you can access it.

XUL:

 <menu id="someid" label='your label' class="menu-iconic" image='chrome://addon/skin/image.png'> ... </menu> 

JavaScript:

You can also set or change the image dynamically (first get a link to the element):

 menu.setAttribute('image', 'chrome://addon/skin/image.png'); 
+6
source share

You can add a context menu using the new Mozilla add-in SDK image using the image property

in the Advanced Settings section:

just add an image attribute like this

  var menuItem = contextMenu.Menu({ include: "*.stackoverflow.com", label: "do something", image: "data:image/png;base64,iVBORw0KGgoAA ...", context: contextMenu.SelectorContext('div.someclass'), contentScriptFile: data.url("cs.js"), items: [ contextMenu.Item({ label: "Item 1", data: "item1" }), contextMenu.Item({ label: "Item 2", data: "item2" }), contextMenu.Item({ label: "Item 3", data: "item3" }) ] }); 

image: element icon, string URL. The URL may be remote, a link to an image in the add-in data directory or data URI.

Mozilla context menu help page for Addon SDK

0
source share

All Articles