I'm working on collapsible menus and I need them to completely hide when one is clicked, instead of just collapsing. This behavior is different from an accordion setup.
To achieve this, I incorporated the following function into my code:
$('#bottomNavBar .collapse').on('show.bs.collapse', function (e) {
// do something…
var me = e.target;
$('#bottomNavBar [aria-expanded="false"]').each(function () {
if (!$(this).is(me)) {
$(this).hide();
}
});
});
The issue I'm facing is that the clicked item also hides because its aria-expanded
becomes false, even though its sub-menus are still visible. I avoided using the shown.bs.collapse
event due to my design preferences. I attempted to compare each item with the active object, but it didn't resolve the problem.