jQuery Forum

I've been trying to get my mind around jquery and jquery-ui and so have been looking through examples and demos all over the place for the last few days.  I'm finding it very difficult to identify which are the CSS elements which are actually making the widgets function in a certain way and which are the elements that are just to make things pretty.

Are there any demos where the CSS is inline and limited to just what is necessary to show how to make something work?  I appreciate that presentation is HUGE, but the current documentation of jquery-ui (at least what I've seen) has a tendency to throw in the necessary parts of CSS intermixed with the preference/aesthetic parts of CSS with no identification of what's needed for the basic functionality and what can be changed to match my own preferences...

Are there other, simpler demos out there?  Or is this just part of the learning curve I've got to get over, identifying the key trees among the rather large forest?  (I'm specifically looking for the button & menu capabilities, but I think the question is more general...)

I am trying to code a menu invoked by a button with a gearbox and a triangle icon.

Much like the gearbox/triangle button used in gmail to access settings except for a bit of text between.

I can get the button nicely formatted using jquery-ui.button.  I can get the menu working using jquery-ui.menu.  But how do I make the menu start invisible and then appear when I press the button or hover (with the rest of the interaction with ESCAPE, move the mouse away from the hover, etc.)?

It appears that a slightly older version of jquery-ui had a jquery-ui.popup and at least one demo (http://view.jqueryui.com/menubar/demos/popup/popup-menu.html) shows it doing exactly what I wanted, but I can't seem to find that "popup" for version 1.10.

In http://blog.jqueryui.com/2012/10/jquery-ui-1-9-0/ it says that menu is great for popup menus.  Does that include popping up from a button?

-Peter