Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Simple Expand/Collapse divs > JQuery?

Tags:

I need to add some accordian style expand/collapse handles to a series of parent container divs in my application. Is this something that's too simple for a library like jquery?

Example:

<div class="handleDiv"> expand | collapse
    <div>child element</div>
    <div>child element</div>
</div>

<div class="handleDiv"> expand | collapse
    <div>child element</div>
    <div>child element</div>
</div>
like image 266
Scott B Avatar asked Mar 13 '10 19:03

Scott B


People also ask

How do you expand a div collapse?

To make an animated collapsible, add max-height: 0 , overflow: hidden and a transition for the max-height property, to the panel class.

How to add collapse in jQuery?

Just add data-toggle="collapse" and a data-target to element to automatically assign control of a collapsible element. The data-target attribute accepts a CSS selector to apply the collapse to. Be sure to add the class collapse to the collapsible element. If you'd like it to default open, add the additional class in.

What is bootstrap collapse?

The collapse JavaScript plugin is used to show and hide content. Buttons or anchors are used as triggers that are mapped to specific elements you toggle. Collapsing an element will animate the height from its current value to 0 .


1 Answers

I have just wrote a plugin to do that.

See http://sylvain-hamel.github.io/simple-expand/

like image 91
Sylvain Avatar answered Sep 28 '22 17:09

Sylvain