How to Do Collapsible Navigation Menus?

[David T. Ashley]

In my application, I'm going to have a navigation pane (i.e. frames) on the
left that links to pages that display in the main window. The list of
choices varies by user, but once a user logs in, it is always the same list.

I'm going to arrange this pane as a hierarchical list of headings,
subheadings, and links, i.e. something like:

Number Theory Tools
Euclid's GCD Algorithm
Continued Fraction Expansion of a Rational Number
LCM
Miller-Rabin Probable Primality Test
Calculation Tools
Arbitrary Expression Evaluation

Etc.

Because there will be so many choices, I'd like to have the ability to
collapse and uncollapse parts of the list, hierarchically. One should, for
example, be able to "collapse" the "Number Theory Tools" part of the list so
that only the heading shows, then uncollapse it later.

What is the best way to accomplish this?

Are there any clever tricks to avoid re-loading the left pane on each
collapse/expand?

Thanks.
--
David T. Ashley (dta@e3ft.com)
http://www.e3ft.com (Consulting Home Page)
http://www.dtashley.com (Personal Home Page)
http://gpl.e3ft.com (GPL Publications and Projects)

[=?ISO-8859-15?Q?Iv=E1n_S=E1nchez_Ortega?=]

Re: How to Do Collapsible Navigation Menus?

David T. Ashley wrote:

[...] I'd like to have the ability to collapse and uncollapse parts of the
list, hierarchically.[...]
>
What is the best way to accomplish this?

Use no-javascript, pure CSS, drop-down menus. There are a couple different
implementations on the web, so search for 'em.

Are there any clever tricks to avoid re-loading the left pane on each
collapse/expand?

Most of the "functional ity" is on the .css file, that is cached and saves
bandwidth. And for the options, they are *all* in the HTML. Being <li>s,
the whole menu is pretty small.

--
----------------------------------
Iván Sánchez Ortega -ivansanchez-algarroba-escomposlinux-punto-org-

http://acm.asoc.fi.upm.es/~mr/ ; http://acm.asoc.fi.upm.es/~ivan/
MSN:i_eat_s_p_a _m_for_breakfas t@hotmail.com
Jabber:ivansanc hez@jabber.org ; ivansanchez@kde talk.net

[Michael Fesser]

Re: How to Do Collapsible Navigation Menus?

..oO(Iván Sánchez Ortega)

>David T. Ashley wrote:
>

>[...] I'd like to have the ability to collapse and uncollapse parts of the
>list, hierarchically.[...]
>>
>What is the best way to accomplish this?

>
>Use no-javascript, pure CSS, drop-down menus.

A properly built JS-based menu is usually more usable and accessible
than a CSS menu. You can implement keyboard navigation and timeouts, so
that the menu stays open for half a second or longer, even if the mouse
pointer leaves the hover area. With pure CSS that's impossible.

Micha

[David T. Ashley]

Re: How to Do Collapsible Navigation Menus?

"Michael Fesser" <netizen@gmx.de wrote in message
news:tkct639k4k 1aub4l01t5ncp1k dkujvu1sm@4ax.c om...

.oO(Iván Sánchez Ortega)
>

>>David T. Ashley wrote:
>>

>>[...] I'd like to have the ability to collapse and uncollapse parts of
>>the
>>list, hierarchically.[...]
>>>
>>What is the best way to accomplish this?

>>
>>Use no-javascript, pure CSS, drop-down menus.

>
A properly built JS-based menu is usually more usable and accessible
than a CSS menu. You can implement keyboard navigation and timeouts, so
that the menu stays open for half a second or longer, even if the mouse
pointer leaves the hover area. With pure CSS that's impossible.
>
Micha

Thank you both. I did search the web and found things that are very similar
to what I want using JavaScript.

So, we're down to my next question ...

Can anyone recommend any books on JavaScript that are tailored for how to
write scripts for web browsers?

Thanks.

[=?ISO-8859-15?Q?Iv=E1n_S=E1nchez_Ortega?=]

Re: How to Do Collapsible Navigation Menus?

David T. Ashley wrote:

Can anyone recommend any books on JavaScript that are tailored for how to
write scripts for web browsers?

Regardless of the book, I recommend developer.mozil la.com as a good
javascript *and* DOM object reference.

Oh, and try firebug for debugging purposes. Just great.

--
----------------------------------
Iván Sánchez Ortega -ivansanchez-algarroba-escomposlinux-punto-org-

Go to a movie tonight. Darkness becomes you.