Collapse Function

[wwonderfull]

How to do a collapse function in WWB. I see a just toggle option which (fade shows hides) in (Action) in Events but is there a way to do toggle Collapse (expand and collapse).

[Pablo]

The accordion implements collapse functionality.
Also, you can use the show/hide events to 'collapse' elements.

[wwonderfull]

How to make the toggle collapse smooth like these meaning the div over or under it just smoothly goes up and smoothly goes down just like we see in responsive menus.
Expected Example:
https://infoguides.wtamu.edu/bootstrap/collapsebutton

Below image is the way WWB does the collapse.

[Pablo]

You can use events for this: show with effect

[wwonderfull]

You can use events for this: show with effect

Collapse uses JavaScript and it also has a smooth css transition

I was trying a more like a Themeable menu or Accordion type of collapse kind of thing when clicking button the div would do transition of the height.

Written in getbootstrap. com
https://getbootstrap.com/docs/5.2/components/collapse/

Sass
Variables

$transition-collapse: height .35s ease;
$transition-collapse-width: width .35s ease;
Classes
Collapse transition classes can be found in scss/_transitions.scss as these are shared across multiple components (collapse and accordion).


.collapse {
&:not(.show) {
display: none;
}
}

.collapsing {
height: 0;
overflow: hidden;
@include transition($transition-collapse);

&.collapse-horizontal {
width: 0;
height: auto;
@include transition($transition-collapse-width);
}
}

so instead of slide in slide out effect can this exact div height Collapse be done using toggle event along with transition?