There is a site with dropdown submenus (the side arrow points downwards - class arrow_01_B (expanded submenu) or has a direction to the right - arrow_01_R (collapsed submenu))
Here is the code for expanding\collapsing the menu
let elemsoffilteropengroup = document.querySelectorAll('.FilterDropdown__filter-open-group');
for (let i = 0; i < elemsoffilteropengroup.length; i++) {
elemsoffilteropengroup[i].addEventListener('click', function(e) {
if (e.target.childNodes[1].classList.contains('arrow_01_R')) {
firstProperty = 'FilterDropdown__toggle-opened';
secondProperty = 'arrow_01_B';
lastProperty = 'IconFont_arrow_01_B';
e.target.childNodes[1].classList.item(0) = firstProperty;
e.target.childNodes[1].classList.item(1) = secondProperty;
e.target.childNodes[1].classList.item(e.target.childNodes[1].classList.length - 1) = lastProperty;
} else {
firstProperty = 'FilterDropdown__toggle-closed';
secondProperty = 'arrow_01_R';
lastProperty = 'IconFont_arrow_01_R';
e.target.childNodes[1].classList.item(0) = firstProperty;
e.target.childNodes[1].classList.item(1) = secondProperty;
e.target.childNodes[1].classList.item(e.target.childNodes[1].classList.length - 1) = lastProperty;
}
}, true);
}Despite the presence of this code, the menu does not expand (collapse). Tell me how to expand\collapse the menu.
Aucun commentaire:
Enregistrer un commentaire