Onglet et information déroulante dans une page

Fermé

ajaoh.38 Messages postés 410 Date d'inscription lundi 5 avril 2010 Statut Membre Dernière intervention 20 mars 2016 - 5 août 2013 à 12:45
ajaoh.38 Messages postés 410 Date d'inscription lundi 5 avril 2010 Statut Membre Dernière intervention 20 mars 2016 - 6 août 2013 à 10:17

Bonjour,

Je sus en train de remasteriser mon site et je cherche des solutions d'ergonomie.
Je cherche à créer un système d'onglet à l'intérieur même d'une page et inclure dans les pages ouvertes par ces onglets : des "menus" déroulants : pour illustrer mes propos :

http://www.newlook.com/furniture/help_centre_faq.jsp?pageName=Returns

il y a les onglets : UK Website / In store...

Et on peut dérouler des information en cliquant sur les petites flèche dans les catégories en dessous.

Comment cela se fait ? En HTML ? Un autre langage ?

Merci de vos réponses :)

A voir également:

Onglet et information déroulante dans une page
Liste déroulante excel - Guide
Supprimer une page word - Guide
Liste déroulante en cascade - Guide
Rouvrir onglet fermé - Guide
Traduire une page - Guide

1 réponse

Réponse 1 / 1

Guiver Messages postés 262 Date d'inscription mardi 30 novembre 2010 Statut Membre Dernière intervention 20 mai 2021 87
5 août 2013 à 12:59

Bonjour,

Sur le site donné en exemple c'est du javascript.
Si tu utilises déjà une bibliothèque comme jquery, tu trouveras facilement des tutos pour le faire.
Si tu n'utilises pas encore de javascript, ce n'est pas très dur, regarde sur google "onglet en javascript"
"spoiler en javascript"

Sinon, tu peux tout faire en CSS. Cependant, cela fonctionnera avec un système d'ancre et peut donc perturber l'utilisateur puisque ça page sera automatiquement scrollé au niveau des onglets. Ce n'est pas un problème si ta page est fixé et ne prend pas plus de 100% de la hauteur de l'écran du client. Mais il y'a peu de chance.

ajaoh.38 Messages postés 410 Date d'inscription lundi 5 avril 2010 Statut Membre Dernière intervention 20 mars 2016 44
5 août 2013 à 13:20

Merci de ta réponse rapide !

Je vais me lancer dans cette direction et je reviens en cas de soucis :)

ajaoh.38 Messages postés 410 Date d'inscription lundi 5 avril 2010 Statut Membre Dernière intervention 20 mars 2016 44
6 août 2013 à 10:17

Bonjour,

Alors pour le système d'onglet j'ai trouvé ce qu'il me fallait!
Pour le spoiler, un peu plus complexe, j'ai bien trouvé un petit bout de code qui serait pas mal :

<div class="Menu"
 onclick="pchild=this.getElementsByTagName('p'); if(pchild[0].style.visibility!='hidden'){pchild[0].style.visibility='hidden'; pchild[0].style.height='0';}else{pchild[0].style.visibility=''; pchild[0].style.height=''}">Catégorie 1
<p style="">sous catégorie 2<br>
sous catégorie 3<br>
sous catégorie 4<br>
sous catégorie 5<br>
</p>
</div>

Mais j'ai quelques soucis : par défaut : le spoiler est "affiché" et j'aimerais qu'il ne le soit pas.
J'aimerais aussi que lorsqu'on survol le spoiler avec la souris : le pointer de celle-ci soit en mode "lien" (avec la petite main)
Est-ce que ces modifications sont possibles ?

Merci

Discussions similaires

Instagram "Désolé, une erreur s'est produite"

Onglet disposition Excel ne s'affiche pas