3

Essentially, it's a collection of panels, stacked towards the top. Each can be expanded or collapsed on its own. When a header is expanded, the headers below it "stick" to its bottom. This is in contrast to the classic accordion, where the headers fall all the way to the bottom of the containing area. See some examples of a "classic" accordion here, and here.

In our system we found this control quite useful. It allows progressive disclosure, but always the user knows what is open, and what is available. We used it as a substitute for an accordion, where users tend to miss the headers lying on the bottom of its area.

Do you know whether this control is a common practice? Can you point to examples? Does it have a proper name? enter image description here

Improve this question
1
  • I always thought it was an accordion. What control do you use to create this?
    – ChrisF
    Dec 31, 2012 at 9:55

2 Answers 2

Reset to default
2

The difference you described exists only because this is a non-exclusive accordion, meaning it doesn't exclusively show a single panel at once, since multiple panels could be expanded at the same time.

Or you can call them collapsible panels, which is where accordion originally came from, people have the need that only 1 panel should be opened at a time, then they came up with the accordion where it restricts that only 1 panel could be opened in a group of panels.

Improve this answer
4
  • That is one difference. Another difference is the division of space. Classic accordion gives all the available space to the open panel, pushing all the way up or down the rest of the headers. In contrast, this control gives only the minimum required space. As a result, the panels are stacked up one against each other. To mt, these differences make a different control.
    – Dvir Adler
    Dec 31, 2012 at 11:31
  • 1
    Where I work we call this type of component a "twistie".
    – superduperfly
    Dec 31, 2012 at 12:21
  • @DvirAdler accordion could be modified to have no auto height and then panels would be resized dynamically, and will have the same behavior as the control you describe. jqueryui.com/accordion/#no-auto-height
    – Andy
    Dec 31, 2012 at 12:38
  • @Andy This example is pretty cool, and does resemble what I described. This particular example, however, does not allow more than one panel open at a time. Personally, I tend to leave the implementation side to the developers, so I'm oblivious to the component's origin. I want to focus on the taxonomy of the logical behavior.
    – Dvir Adler
    Jan 1, 2013 at 9:45
1

Since you have different types of content in your accordion, I would call this control an Accordion Content Panel. It's behaviors if opening one panel would close another is a matter of implementation of the control.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.