[thelist] Adding an indicator to collapsable content

Richard Harb rharb at earthling.net
Sun Jan 30 11:23:47 CST 2005


Without having a solution in code I think the following might work:

<div class="container">
<p id="desc">[+] Click here ...</p>
<div class="stuff-to-hide">
...
</div>

when changing the visibility / hidden status also document.write or better
exchange the contents of id.desc with innerHTML / innerText to what you need.

That's just a concept, you'd need to get the actual syntax somewhere else (I'm
not that well versed in Javascript).

HTH

Richard

-----Original Message-----
From: Dave
Sent: Sunday, January 30, 2005, 4:21:11 PM
> List,

>     The Situation:
>     I have succeeded in getting content to show and hide using Java 
> Script and CSS. I would like to extend the idea just a little further by 
> adding a small indicator by the link which activates the show and hide 
> script.
>     All I want is a "+" beside the link when the content is hidden, and 
> a "-" when it is shown. Like so:
>     In hidden state:
> + Click here to see stuff
>     In shown state:
> - Click here to see stuff
>     stuff
>     stuff
>     stuff

>     The Problem:
>     I have no idea how to do this. The show/hide action I'm using was 
> taken from a tutorial on the net, and it was only by asking questions 
> about it here that I got it to work.

>     What I've tried so far:
>     I looked again on the net for a more robust script, but while I 
> learned that what I was looking for was termed "collapsible content", 
> and so how to make remote show and hides, I did not see a script that 
> included an indicator like I am looking for.

>     The Question:
>     Can anyone recommend a script that does what I describe?

>     Any help much appreciated.

> -- 
> Dave Gutteridge
> dave at tokyocomedy.com




More information about the thelist mailing list