Close other dropdowns when a new dropdown is clicked.
This commit is contained in:
parent
2b4534f403
commit
2bf4c596d8
1 changed files with 16 additions and 2 deletions
|
|
@ -87,12 +87,13 @@ const t = useTranslations(lang);
|
|||
let dropdown_toggles = document.getElementsByClassName("dropdown-toggle");
|
||||
Array.from(dropdown_toggles).forEach((toggle) => {
|
||||
toggle.onclick = function() {
|
||||
toggleEventListener(toggle);
|
||||
closeOtherDropdowns(toggle.id);
|
||||
toggleDropdown(toggle);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function toggleEventListener(toggle) {
|
||||
function toggleDropdown(toggle) {
|
||||
let dropdown = document.getElementById(toggle.id + "-menu");
|
||||
if (dropdown.style.maxHeight == "0px" || dropdown.style.maxHeight == "") {
|
||||
dropdown.style.maxHeight = dropdown.scrollHeight + "px";
|
||||
|
|
@ -114,6 +115,19 @@ const t = useTranslations(lang);
|
|||
}
|
||||
}
|
||||
|
||||
function closeOtherDropdowns(dropdownIDToExclude) {
|
||||
let dropdowns = document.getElementsByClassName("dropdown-menu");
|
||||
Array.from(dropdowns).forEach((dropdown) => {
|
||||
dropdown.style.maxHeight = "0px";
|
||||
setTimeout(() => {
|
||||
if (dropdown.id != dropdownIDToExclude + "-menu") {
|
||||
let dropdown_toggle = document.getElementById(dropdown.id.replace("-menu", ""));
|
||||
dropdown_toggle.style.borderRadius = "10px";
|
||||
}
|
||||
}, 300);
|
||||
});
|
||||
}
|
||||
|
||||
function closeDropdown(dropdownID) {
|
||||
let dropdown = document.getElementById(dropdownID);
|
||||
if (dropdown) {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue