How it works
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 it’s current value to 0. Given how CSS handles animations, you cannot use padding on a .collapse element. Instead, use the class as an independent wrapping element.
Example
Click the buttons below to show and hide another element via class changes:
- .collapse hides content
- .collapsing is applied during transitions
- .collapse.show shows content
You can use a link with the href attribute, or a button with the data-target attribute. In both cases, the data-toggle="collapse" is required.
Multiple targets
Step by step goes a long way ✨