How to toggle the opened <details>

If you have two <details> tags, and you want to close one, when you open the other, you can use this short js:

<script>
const details = document.querySelectorAll("details");

details.forEach(d => {
  d.addEventListener("toggle", () => {
    if (d.open) {
      details.forEach(other => {
        if (other !== d) {
          other.removeAttribute("open");
        }
      });
    }
  });
});
</script>

Lascia un commento

Il tuo indirizzo email non sarĂ  pubblicato. I campi obbligatori sono contrassegnati *