HI.
okay, so this is my first time asking a question, or joining a forum. so please be kind anywho, i've came across a particular code that can do almost exactly what i want & i've tweaked it here and there to somehow meet my own requirement, the only thing missing is that it doesn't include the [+] and [-] images to denote that the text can be expanded or collapsed.
so this here is the code & i would really appreaciate it if someone can help me extend this code to include the [+]/[-]. i know nuts about javascript, so it'll be helpful if it doesn't include any (: THANKS in advance
[<script>
var toggledDisplay = new Object();
toggledDisplay['sub1'] = true;
toggledDisplay['sub2'] = true;
toggledDisplay['sub3'] = true;
function toggleDisplay(bDisplayed)
{
if(!document.getElementById || toggleDisplay.arguments.length < 2) return;
var displayed = new Object();
displayed['true'] = 'block';
displayed['false'] = 'none';
for(var i = 1; i < toggleDisplay.arguments.length; i++)
{
oDisplay = document.getElementById(toggleDisplay.arguments[i]);
if(oDisplay)
{
oDisplay.style.display = displayed[bDisplayed];
// mozilla is the only browser out of the lot that can't get this right. so, if we're
// setting an object's display style to block, we gotta reload any images contained
// within that block. mozilla won't do it for you like every other browser that
// supports the functionality of changing the display style dynamically.
// begin crap browser hack
if(bDisplayed)
{
oImages = oDisplay.getElementsByTagName('IMG');
for(var j = 0; j < oImages.length; j++)
oImages[j].src = oImages[j].src;
}
// end mozilla, err, crap browser hack
if(typeof toggledDisplay[toggleDisplay.arguments[i]] != 'undefined')
toggledDisplay[toggleDisplay.arguments[i]] = !bDisplayed;
}
}
}
</SCRIPT>
<A title="" onclick="toggleDisplay(true, 'sub1', 'sub2', 'sub3' , 'sub4', 'sub5', 'sub6', 'sub7');" href="java script://" target="">Expand All</A> | <A title="" onclick="toggleDisplay(false, 'sub1', 'sub2', 'sub3' , 'sub4', 'sub5', 'sub6', 'sub7');" href="java script://" target="">Collapse All</A> <FONT color=#000000>
<A title="" onclick="toggleDisplay(toggledDisplay['sub1'], 'sub1')" href="java script://" target="">Text</A>
<div id=sub1>
i'm a text. leave me be.</div>
<p><A title="" onclick="toggleDisplay(toggledDisplay['sub2'], 'sub2')" href="java script://" target="">Another text</A></TD></TR>
<div id=sub2>
I'm another text, be kind to me.</div>
<script language=JavaScript type=text/javascript>
<!--
toggleDisplay(false, 'sub1', 'sub2', 'sub3', 'sub4', 'sub5', 'sub6', 'sub7');
toggleDisplay(true, 'toggleAll');
//-->
</SCRIPT>]