This plugins allows you to create animatable bubble menus in a cool way and drag them through the screen.
The final effect is similar to Dolphin's or Path's menu.
You can position the menu in 9 different anchor points of the screen, as we'll see, and you can drag it from an anchor point to another.
FerroMenu is really simple to use, due to the multiple available plugin's options.
If you like this plugin, find it useful and want to contribute to it's development , please donate with paypal:
For any comment, bug, personalization request or doubt, you can send me an email to email@example.com, or use the comments section.
FerroMenu allows you to:
position menu in one of the 9 anchor points of the screen: top-left, top-center, top-right, center-left, center-center, center-right, bottom-left, bottom-center, bottom-right
move menu simply by dragging it around the screen. When the drag ends, the menu will position itself in nearest anchor point
customize menu aspect simply by changing it's CSS
customize transitions setting their duration, easing, delay of the menu items, rotation angle for the opening/closing action, margin from the edges of the viewport, radius (i.e the distance of the items from the controller)
the items of the menu will be rearranged after each movement, basing on the space available around the menu.
enable / disable dragging feature
encapsulate the sliding contents into a container;
How to use
1. Include necessary JS files
Obviously you need to include jQuery library.
2. Create an HTML list
Create a list that will be arranged as menu, e.g. :
The initialization is called giving the jQuery selector of the list that contains the menu items.
If the initialization is called as above, the plugin will use it's default values, otherwise you can give some custom parameters, e.g. :
For a more detailed example, see demo number 3. If you check the source code you will see the handling of 3 events: menuready, menudrag and menudragend;
Here are three simple examples of different FerroMenu configurations. Note that in these examples I use Font Awesome Webfont to make the menu items a little bit nice.
For any comment, bug, personalization request or doubt, you can send me an email to firstname.lastname@example.org.
[Sep, 8 2014 - 12:18] : Released ferroMenu 1.2.3 which adds a new public function : refreshMenu.;
[Mar, 18 2014 - 8:15] : Released ferroMenu 1.2.2 with a bugfix again for Firefox. Thanks to Patrick Putz for feedback and support!;
[Feb, 17 2014 - 8:18] : Released ferroMenu 1.2.1 that fixes a boring bug rising with Firefox. Thanks to Dorian Garcia for feedback and support!;
[Feb, 10 2014 - 12:55] : FerroMenu 1.2 released!
This release adds the feature to create multiple menus on the same page....Check it out!;
[Nov, 14 2013 - 13:11] : FerroMenu 1.1 is out!
This release adds a new option to open menu by default at start and 6 custom events: menuready, menuopened, menuclosed, menudragstart, menudrag and menudragend. A new demo will show you the way...Check it out!;
[Oct, 21 2013 - 9:55] : Brand new jQuery plugin FerroMenu is here! Say hello!
FerroMenu is a simple, responsive, customizable and probably useless jQuery menu plugin. Powered by HTML5 and CSS3.;