Animated Collapsible DIV v2.4 Grouped Items

[ericdolson]

1) Script Title: Animated Collapsible DIV v2.4

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

3) Describe problem:

I implemented this script on my site and love it! I wanted the cleanest UI possible and opted to "group" the items in my list so that when another item in the list is clicked it will hide the previous and expand the current. I have a large number of users who would like the option to "view all", but the grouping of the elements do not allow all the DIVs to be displayed at once.

Is there an addition to the script or a "view all" button that could override the grouping restriction so that all DIVs could be expanded at the same time?

[ddadmin]

Sure, you can try the attached modified .js file. Then when calling the public function show() to reveal a list of animated DIVs, populate the new second parameter with the value "true", for example:

<a href="javascript:animatedcollapse.show(['cat', 'dog', 'rabbit'], true)">Show Hide these DIVs</a>

Assuming "cat", "dog", and "rabbit" belong to the same group, they will now all expand when the above is clicked on, versus just the last one.

[ericdolson]

That worked perfectly! Thank you for the modified script! I implemented it with a "show all" button and all the DIVs that were grouped together stayed opened just like you said. I also implemented a "hide all" button to clean everything up again by collapsing all the DIVs. After the "close all" function and the DIVs collapsed, I clicked on the individual list items and they worked as before as grouped items with an expanding DIV collapsing the previous...PERFECT! That is exactly what I was looking for!

Thank you for the genius work!

[ddadmin]

Not a problem, glad I could help!