PDA

View Full Version : [DHTML] Collapsable Div with limit



Master_script_maker
12-25-2007, 09:56 PM
There is a better version I have just made that is simpler then this here (http://dynamicdrive.com/forums/showthread.php?t=27836)
1) CODE TITLE: Collapsable Div with limit

2) AUTHOR NAME/NOTES: Master_script_maker

3) DESCRIPTION:
A script that expands/collapses divs with a limit of how many can be opened. If someone tries to open more then the limit, the first one opened will be collapsed.
To open/close a div with a link uses this:
<a href="#" onClick="ReverseContentDisplay(Div id)" ></a>
or with a button:
<input type="button" value="" onClick="ReverseContentDisplay(Div id)" />



4) URL TO CODE: http://masterproject.freehostia.com/div/

Here is the code for it:

<script type="text/Javascript">

var num=5; //number of div's that are allowed open at a time
var previousD = new Array();
var last;
function HideContent(d) {
document.getElementById(d).style.display = "none";
}
function ShowContent(d) {
document.getElementById(d).style.display = "";
}
function ReverseContentDisplay(d) {
var i=num;
if(document.getElementById(d).style.display == "none") {
if(previousD[0] != null) {
if(num != 1 && last != "hide") {
while(i>0) {
var j=i-1;
previousD[i] = previousD[j];
i=i-1;
}
if(previousD[num] != null) {
HideContent(previousD[num])
}
} else {
last="";
if(num==1) {HideContent(previousD[0]);}
}
}
ShowContent(d);
previousD[0] = d;
}else {
last="hide";
HideContent(d);
}
}
</script>

djr33
12-25-2007, 11:59 PM
I like that a lot. Simple yet useful.

Master_script_maker
12-26-2007, 12:32 AM
thanks, i tried to have a good compromize of functionality and simplicity