Hi Dave,
Just my 2-cents worth... Users are very familiar with accordion
widgets - they are used in thousands of applications. Almost NEVER is
the 'header' of an accordion panel used as link - its normal and
EXPECTED functionality is to 'open' an Accordion section.
So as a usability consultant, I find the menu example on Dynamic Drive
to have poor usability. It is disconcerting and annoying to users when
a common widget does not do *what they expect*. Therefore I recommend
avoiding a menu design that *looks like* an accordion, but really is
not.
To provide affordance to users, the "links" should appear visually
different than the "expanders" - the [+] graphic is insufficent for
this - the familiarity of the accordion design will still fool people.
So the items that are hyperlinks should look like links (however you
choose to style links), and the headers that are *truly* just a header
should look different from the links.
Plus, given how you are using this menu, I advise against using a
'true' accordion because there is no reason to collapse one sub-menu
when the user expands another. In other words, it should work more
like a 'tree menu' than an accordion - this is more intuitive and
usable.
If this functionality suits your need, then there is no need for a
widget at all. The code to expand/collapse sub-menus is dead simple.
Here is one example
$("ul#menu li.menuHeader").click(
function () { $(this).children(":first").toggle('slow');
);
That's it - menu done!
As for 'styling' the menu - simply add the standard UI classes. The UI
CSS Framework documention lists all the classes created by ThemeRoller
- just pick the one(s) applicable to the look you want, and add these
to your elements. Easy-peesy.
You can read about UI CSS Framework, and the styles available, here...
* http://jqueryui.com/docs/Theming/API
You can read about the UI Accordion widget here...
* http://jqueryui.com/demos/accordion/
BTW, note the info at the bottom of the Accordion page...
"NOTE: If you want multiple sections open at once, don't use an
accordion"
I hope that helps.
/Kevin
On May 11, 3:52 pm, badger1406 <[email protected]> wrote:
> Thanks for the update. I'm not really worried about html rotated 90
> degrees, just a straight forward side menu.
>
> I can have a go at overiding the UI styles for the accordion - but it
> slightly surprises me still that this is not a default / default style
> for the accordion to use it as a menu widget. Or is there another
> widget I should be using for this ?
>
> thx dave
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
