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.

Accordions

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

Default

Dignissim elit sit. Abdo erat fere molior suscipit ut. Humo in lenis lucidus utinam. Blandit consectetuer paulatim.
Adipiscing dolore erat iriure quis scisco vindico virtus vulputate. Damnum esca eum iriure letalis lobortis luptatum paratus refoveo torqueo.
Distineo inhibeo quadrum te voco ymo. Saluto turpis ut uxor. Magna plaga populus. Aliquip ludus mauris suscipit.

List Style

Dolus enim ideo metuo nutus oppeto paulatim pneum. Huic quia utrum wisi. Abluo duis eros feugiat mos ratis sit.
Exputo inhibeo molior tation valetudo. Neque voco wisi. Abbas immitto te vel. Consequat dolore letalis patria rusticus tum.
Aptent conventio diam duis facilisis huic paratus tum ullamcorper velit. Jumentum os quadrum quidne suscipit.

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.

Abdo ideo si ullamcorper utinam virtus. Aliquam blandit brevitas luctus neo refoveo rusticus vindico. Abigo accumsan amet augue facilisis luctus nisl pertineo refero.
Antehabeo decet laoreet tamen typicus utrum verto. Abbas os suscipere valetudo zelus. Duis hendrerit olim probo velit.
Ad decet eu. Gravis jus typicus. Aliquam autem distineo eros esca euismod ideo immitto persto 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