Navigation Bar, div anzeigen beim klicken auf einen Link

[Rolf B]

Hallo Gunnar,

Problem daran: dabei feuern wieder toggle-Events, sodass die Dinger endlos auf- und zugehen.

Du magst das CSS Genie sein, aber in Algorithmik kann ich Dir noch was zeigen 😉. Welcher Vollpfosten hat eigentlich in der Spec vergessen hinzuschreiben, dass das toggle Event mit bubbles=true erzeugt ewrden sollte? Oder war das etwa sinistre Absicht?

(Edit: Und bezüglich Code Quality muss ich noch eine Menge lernen)

<div class="detailsGroup">
  <details>...</details>
  <details>...</details>
  <details>...</details>
  <details>...</details>
  <details>...</details>
</div>

(Edit: class statt id)

document.querySelectorAll(".detailsGroup details")
        .forEach(d => d.addEventListener("toggle", detailsToggler));

function detailsToggler(ev) {
   if (!ev.target.open) return;
   let container = ev.target.closest(".detailsGroup");
   for (let d of container.querySelectorAll("details")) {
      if (d != ev.target)
         d.open = false;
   }
}

(Edit: querySelectorAll auf closest(".detailsGroup") anwenden, nicht auf document)

Rolf