accordion-menus MODIFIED THAT FOUND IN YOUR SITE
http://www.switchonthecode.com/tutorials/javascript-and-css-tutorial-accordion-menus
CODE AT
document.getElementById(nIDpm).value = "-";
if (document.getElementById(openAccordionpm).value == "-") {
document.getElementById(openAccordionpm).value = "+";
}
I TRY MAKE "+" A "-" AND VICE VERSA BUT ONLY ONE WAY MAKE IT, WELL?
ONLY ABOVE CODE NEED TO LOOK AT...
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Accordions exe 18-3</title>
<style type="text/css">
.AccordionTitle, .AccordionContent, .AccordionContainer
{
position:relative;
width:200px;
}
.AccordionTitle
{
height:20px;
overflow:hidden;
cursor:pointer;
font-family:Arial;
font-size:8pt;
font-weight:bold;
vertical-align:middle;
text-align:left;
background-repeat:repeat-x;
display:table-cell;
background-image:url('title_repeater.jpg');
-moz-user-select:none;
}
.AccordionContent
{
height:0px;
overflow:auto;
display:none;
}
.AccordionContainer
{
border-top: solid 1px #C1C1C1;
border-bottom: solid 1px #C1C1C1;
border-left: solid 2px #C1C1C1;
border-right: solid 2px #C1C1C1;
}
</style>
<script type="text/javascript">
var ContentHeight = 200;
var TimeToSlide = 250.0;
var openAccordion = '';
var openAccordionpm = '';
function runAccordion(index)
{
var nID = "Accordion" + index + "Content";
var nIDpm = "Accordion" + index; // Accordion 2 pressed
if(openAccordionpm == nIDpm) // Accordion 1 old opened to get closed
nIDpm = '';
if(openAccordion == nID)
nID = '';
setTimeout("animate(" + new Date().getTime() + "," + TimeToSlide + ",'"
+ openAccordion + "','" + nID + "')", 33);
openAccordion = nID;
document.getElementById(nIDpm).value = "-";
if (document.getElementById(openAccordionpm).value == "-") {
document.getElementById(openAccordionpm).value = "+";
}
openAccordionpm = nIDpm;
}
function animate(lastTick, timeLeft, closingId, openingId)
{
var curTick = new Date().getTime();
var elapsedTicks = curTick - lastTick;
var opening = (openingId == '') ? null : document.getElementById(openingId);
var closing = (closingId == '') ? null : document.getElementById(closingId);
if(timeLeft <= elapsedTicks)
{
if(opening != null) {
opening.style.height = ContentHeight + 'px';
}
if(closing != null)
{
closing.style.display = 'none';
closing.style.height = '0px';
}
return;
}
timeLeft -= elapsedTicks;
var newClosedHeight = Math.round((timeLeft/TimeToSlide) * ContentHeight);
if(opening != null)
{
if(opening.style.display != 'block')
opening.style.display = 'block';
opening.style.height = (ContentHeight - newClosedHeight) + 'px';
}
if(closing != null)
closing.style.height = newClosedHeight + 'px';
setTimeout("animate(" + curTick + "," + timeLeft + ",'"
+ closingId + "','" + openingId + "')", 33);
}
</script>
</head>
<body><div id="AccordionContainer" class="AccordionContainer">
<div>
<div class="AccordionTitle" onselectstart="return false;">
<input name="Accordion1" id="Accordion1" type="button" value="+" onclick="runAccordion(1);" />Accordion 1
</div>
</div>
<div id="Accordion1Content" class="AccordionContent">
I Am Accordion 1.
</div>
<div>
<div class="AccordionTitle" onselectstart="return false;">
<input name="Accordion2" id="Accordion2" type="button" value="+" onclick="runAccordion(2);" />Accordion 2
</div>
</div>
<div id="Accordion2Content" class="AccordionContent">
I Am Accordion 2.
</div>
<div>
<div class="AccordionTitle" onselectstart="return false;">
<input name="Accordion3" id="Accordion3" type="button" value="+" onclick="runAccordion(3);" />Accordion 3
</div>
</div>
<div id="Accordion3Content" class="AccordionContent">
I Am Accordion 3.
</div>
<div>
<div class="AccordionTitle" onselectstart="return false;">
<input name="Accordion4" id="Accordion4" type="button" value="+" onclick="runAccordion(4);" />Accordion 4
</div>
</div>
<div id="Accordion4Content" class="AccordionContent">
I Am Accordion 4.
</div>
<div>
<div class="AccordionTitle" onselectstart="return false;">
<input name="Accordion5" id="Accordion5" type="button" value="+" onclick="runAccordion(5);" />Accordion 5
</div>
</div>
<div id="Accordion5Content" class="AccordionContent">
I Am Accordion 5.
</div>
</div>
</body>
