- Passer au contenu principal
- Passer à « À propos de ce site »

# Interface à onglets

- Documentation
- Questions ou commentaires?

## But

Comprime plusieurs sections de contenu dans le même espace physique et fourni des onglets qui permettent à l'utilisateur de choisi la section de contenu à afficher.

## Exemple 1

Avec stockage de session pour se rappeler du dernier onglet consulté. (Comportement par défaut)

Exemple 1

Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Exemple 3 Texte d'exemple. Autre texte d'exemple. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.

Exemple 2

Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.

Exemple 3

Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.

Voir le troisième panneau

Visualiser le code

    <div class="wb-tabs">
    	<div class="tabpanels">
    		<details id="details-panel1">
    			<summary>Exemple 1</summary>
    			<p>
    				...
    			</p>
    		</details>
    		<details id="details-panel2" open="open">
    			<summary>Exemple 2</summary>
    			<p>
    				...
    			</p>
    		</details>
    		...
    	</div>

    	<p class="mrgn-tp-md"><a href="#details-panel3" class="wb-tabs-ext">Voir le troisième panneau</a></p>
    </div>

## Exemple 2

Avec classe ignore-session. Ceci annule le stockage de session qui permet de se rappeler du dernier onglet consulté. (Applicable avec la classe ou l'attribut `data-wb-tabs`)

Exemple 1

Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Exemple 3 Texte d'exemple. Autre texte d'exemple. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.

Exemple 2

Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.

Exemple 3

Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent. Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.Texte d'exemple. Autre texte d'exemple. Texte d'exemple différent.

Visualiser le code

    <div class="wb-tabs ignore-session">
    	<div class="tabpanels">
    		<details id="details-panel10">
    			<summary>Exemple 1</summary>
    			<p>
    				...
    			</p>
    		</details>
    		<details id="details-panel20">
    			<summary>Exemple 2</summary>
    			<p>
    				...
    			</p>
    		</details>
    		...
    	</div>
    </div>

Date de modification :
  2015-02-24