Leaflet Marker Menu Plugin
This plugin adds animated circular menus to your leaflet markers. Unfortunately there is only support for css3 animations. Please see the demo page.
###Usage
var marker = L.marker([-33.4373, -70.6437]); marker.setMenu({ radius: 75, // radius of the circle, size: [24, 24], // menu items width and height animate: true, // [OPTIONAL] default true duration: 200, // [OPTIONAL] animate duration defaults 200ms items: [{ title: "Menu Item 1", // [OPTIONAL] will be link's title attribute className: "extra-class", // [OPTIONAL] you can add your css classes click: function () { // callback function fired on click. this points to item console.log("Menu Item 1"); } }, { title: "Menu Item 2", className: "extra-class red-circle" click: function () { console.log("Menu Item 2"); } }] }); // You can open menus programmatically marker.openMenu(); // or close marker.closeMenu(); // You can remove them marker.removeMenu(); // You can get the menu object var menu = marker.getMenu(); // and you can add items to it menu.append([{ title: 'another', click: function () { console.log('another'); } }]); menu.hide() // hide (display: none) menu.show() // show (display: block) // You can create menu's separated from marker var menu2 = L.markerMenu({ radius: 75, size: [24, 24], animate: true, duration: 200, items: [{ title: "Menu Item 1", className: "extra-class", click: function () { console.log("Menu Item 1"); } }] }); // and you can add them to markers marker.setMenu(menu2);

