Tabs

.modul-tabs

Hinweis: Alle Rollen und Aria-Attribute werden mit Javascript dem Markup hinzugefügt.

Inhalt Panel 1

Inhalt Panel 2

Inhalt Panel 3

HTML

<div class="modul-tabs js-tabs">
    <ul class="tablist">
        <li class="tab"><a href="#panel1">Panel 1</a></li>
        <li class="tab"><a href="#panel2">Panel 2</a></li>
        <li class="tab"><a href="#panel3">Panel 3</a></li>
    </ul>
    <div id="panel1" class="tabpanel">
        <p>
            Inhalt Panel 1
        </p>
    </div>
    <div id="panel2" class="tabpanel">
        <p>
            Inhalt Panel 2
        </p>
    </div>
    <div id="panel3" class="tabpanel">
        <p>
            Inhalt Panel 3
        </p>
    </div>
</div>





siehe auch: Barrierefreies Registernavigation