i am dustin diaz

DHTML expand and collapse div menu

This is another one of those "I've seen this done way too often," and of course, it's a lot easier than what folks make it. The simple pull out, drop down, expanded and collapsed div (there's such a variety of names we can call it) is now here for you copy and pasting pleasure.

JavaScript: Element Block Toggle

function switchMenu(obj) {

var el = document.getElementById(obj);

if ( el.style.display != 'none' ) {

el.style.display = 'none';

}

else {

el.style.display = '';

}

}

And there ya have it. View the Block-Toggle Demo in action.

How to collapse all on page 'load'

If you're wondering how to collapse any given amount of particular elements, you can simply use this function in combination with the prototype $() dollar function and addEvent:

Prototype dollar $() function

function $() {

var elements = new Array();

for (var i = 0; i < arguments.length; i++) {

var element = arguments[i];

if (typeof element == 'string')

element = document.getElementById(element);

if (arguments.length == 1)

return element;

elements.push(element);

}

return elements;

}

collapse all at page load

function collapseAll(objs) {

var i;

for (i=0;i<objs.length;i++ ) {

objs[i].style.display = 'none';

}

}

function pageLoad() {

collapseAll($('myDiv1','myDiv2','myDiv3'));

}
addEvent(window,'load',pageLoad);