I've been thinking of making buttons to collapse sections of a resume I've put on a site online. I'm wondering if there's an accepted practice for making a section collapsible, or if I should just set the value of the divs to empty, and upon click, call a function that will fill the divs.
Would this be the best method, or are there better/more elegant methods?
The most common way to collapse content is to set the CSS property display to none:
// to collapse
myElement.style.display="none";
// to expand
myElement.style.display="block";
If you're using jQuery, it has hide and show to do this. As a bonus, you can also pass a duration to them and jQuery will animate it:
// to collapse with a 1000ms animation
myjQueryElement.hide(1000);
// to expand with a 1000ms animation
myjQueryElement.show(1000);
My favourite script to use for collapsible div's is this one by Dynamic Drive,
Not only is it 'pretty' and user friendly but it is also so simple to implement, use and the script allows for all kinds of modifications :)
http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm
