Frage zum Wiki-Artikel „zugängliches Akkordeon“

[Matthias Scharwies]

Servus!

@@Michael

im Artikel steht

Im wirklichen Leben wäre es ratsam, das aria-hidden-Attribut erst bei der Initialisierung auf false zu setzen, sodass die Inhalte auch ohne JavaScript gelesen werden können.

WTF‽ Dem Schreiberling dieses Hinweises ist der Mangel an dem Artikel bewusst, aber anstatt ihn zu beheben, wird ein Hinweis angebracht, dass der Artikel mangelhaft ist‽

Stimmt, ist umständlich gedacht.

Also:

1. HTML-Markup ändern:

  <button aria-expanded="true" aria-controls="collapsible-0">Section 1</button>
  <div id="collapsible-0" aria-hidden="false">
    <p>Inhalt 1</p>
  </div>
  ...

Jetzt sind alle divs auch ohne JS sichtbar.

Per JS können jetzt alle offenen Elemente zu- und wieder aufgeklappt werden.

2. Schöner wäre natürlich, wenn alle Elemente beim Laden des JS zugeklappt würd en:

	// alle Elemente mit aria-expanded=true werden zugeklappt
	var acc = document.querySelectorAll('[aria-expanded="true"]'),
		index;
	for (index = 0; index < acc.length; index++) {alert(1);
		acc[index].setAttribute('aria-expanded', false);
		var panel = acc[index].nextElementSibling;
		var hidden = (panel.getAttribute('aria-hidden') == 'false' || false)? true : false ;
    	panel.setAttribute('aria-hidden', hidden);
	}	

Ist geändert!

LLAP 🖖

Herzliche Grüße

Matthias Scharwies