i need a name for what i'm trying to do

[spudlee]

hi there, i hope i'm not asking too dumb a question but i'm in desperate need of some help as i'm trying to redesign my website at the moment and i am trying to create something which i don't have a name for, therefore i can't search for tutorials myself.

i am trying to create a set of text that will sort of roll under a link so that it appears only when i hit the link on the same page. what is that called? i don't see it on my websites so i can't link to an example.

the scenario:

i have a list of items (records and cds) with descriptions that i don't want to appear under each item unless the user clicks on the link for it. rather than a popup window, i want the description to smoothly appear under that item in the list (on the same page) and disappear if the user clicks on the link again.

that is
record 1
record 2
record 3
record 4

which are all linked to their description.

say if i want to read about record 3, i want the look like this:

record 1
record 2
here goes the description about
the artist and the record
etc etc
record 3
record 4

and say i want to then read about another item, i want the original popup thingy to remain eg:

record 1
record 2
here goes the description about
the artist and the record
etc etc
record 3
here goes another description about
the artist and this record
etc etc
record 4


so my questions are: what is that action called? is it a css or javascript or html code?

any help will be gratefully received!!

thanks in advance,
leigh

[spudlee]

btw, i am also open to suggestions about alternate ways of designing my website, which is essentially a little indie music mailorder site.

currently, the site is very basic - several pages of cd after cd (with an individual description) separated into 2 columns. it makes the pages very long and a bit hard to navigate for the shopper as they have to read through lots of text. although i want to keep the descriptions, i want to hide them unless you click on them so that i can consolidate them onto one page of just a list of all the items in stock, and then a description can be read if the shopper wants to click on a link. preferably no popups because they're kind of annoying and popup blockers would probably prevent them from being seen anyway.

ideas welcome!

[blain]

I know exactly what you mean, and the name escapes me too.

Basically the effect is done by hiding a layer or div and then making it visible using a hover state or rollover.

[mark87]

Try something like this -

http://www.tutorio.com/tutorial/javascript-expanding-menu

[spudlee]

expandable and collapsible menus! thanks mark! the link you've provided isn't working for me, but now i can actually google some tutorials for it.

ahhh... i can go to sleep now.

[ronaldb66]

When Mark87 mentioned expandable menus, the tree menu concept came to mind: the Dynamic Drive "Smart Folding Menu Tree Script (http://www.dynamicdrive.com/dynamicindex1/navigate1.htm)" fulfills most of your requirements concerning expanding and collapsing and shouldn't be too hard to adapt to your needs (instead of a menu list, you just need a block element to hold the text.