Skip to content

Elements:Collapse / Accordions

The collapse plugin allows content to be "collapsed" and hidden and a trigger to show it like with an accordion effect.

Basic Example

The trigger element should have a data-toggle="collapse" attribute and either a href or data-target attribute pointing to the target element it should control.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.

Multiple targets

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.

Accordions

By combining the collapse functionality with the cards component you can create flexibility accordions.

Default

Abdo eligo exputo huic in tincidunt tum ulciscor venio vindico. At cui diam pagus. Autem distineo ea iaceo imputo iustum luptatum odio te tincidunt.
Autem damnum iaceo jumentum modo odio. At elit esse feugiat importunus jumentum si typicus. Lucidus tation vulpes.
Defui distineo enim hendrerit imputo luctus mauris olim singularis valetudo. Abigo eu lobortis obruo. Lenis sudo zelus.

List Style

Blandit cui damnum dolus. Damnum enim iusto nostrud paulatim pertineo quae tego zelus. Camur cogo exerci nunc valetudo.
Abico melior minim similis. Erat esse eu ideo luctus quibus torqueo turpis typicus. Damnum exerci neque pertineo quadrum tation tincidunt.
Abdo dolus in lobortis praesent roto sino sudo. Accumsan gravis refoveo usitas ut. Comis enim exerci iaceo modo pagus torqueo vulputate.

Accordion Scroll To Top

Add the attribute data-accordion-focus to the card-accordion element to have the page scroll to the top of the accordion when the accordion items are clicked.

Ad nisl suscipit valde valetudo. Hendrerit tamen valde. Erat facilisis nimis. Antehabeo at dignissim exerci loquor obruo persto refoveo torqueo.
Abdo augue esca lenis quadrum quae. Abbas abdo consequat fere neque odio sit sudo. Antehabeo brevitas ibidem immitto sagaciter ullamcorper ymo.
Commodo facilisi jumentum nibh tincidunt ullamcorper vulpes. Diam feugiat neo nibh tego. At commoveo decet feugiat ibidem imputo lenis lucidus pala sudo.

Awesome Features

99.9% Uptime Free Upgrades Fully Responsive Bug Free

Theme Colours

Green Red Blue Purple Pink Orange Lime Blue-dark Red-dark Brown Cyan-dark Yellow Slate Olive Teal Green-bright

Cookies are NOT enabled so colour selection is not persistent.

Back to main homepage

Back to intro page