NOTE: If you want multiple sections open at once, don't use an accordion
This drives me nuts! If you have to write a note about something that the control doesn't do, bolded and in a larger font size in the documentation, because lots of people want to do that, or are asking for it, the control should probably perform that function.
This is exactly what I wanted to try out for one of our UI prototypes. Usually, we wanted one section open at a time (the accordion behavior), but sometimes we want to see all 5 sections (say for printing or so you don't have to remember the first section when looking at the last section.
I found this excellent example of how to hack the jQuery UI accordion to allow multiple sections to be expanded at the same time: http://jsbin.com/eqape.
I then added this bit of JavaScript to expand and collapse all the sections. These are hooked up as click handlers for a couple of icons on the page.
This improved the jQuery accordion significantly and I hope we see all this behavior native to the control sometime in the future.
Hey John, I tired to follow your direction and for some reason only the last accordion expand or collapse. In your example above I had to change .accordion to #accordion since Jqury ui uses an id and not a class. IS there anyway you could help?
ReplyDeleteIt looks like the jquery UI interface / behavior has changed with the newer versions.
ReplyDelete