Onglet et information déroulante dans une page
ajaoh.38
Messages postés
413
Date d'inscription
Statut
Membre
Dernière intervention
-
ajaoh.38 Messages postés 413 Date d'inscription Statut Membre Dernière intervention -
ajaoh.38 Messages postés 413 Date d'inscription Statut Membre Dernière intervention -
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 :)
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 dans word - Guide
- Liste déroulante en cascade - Guide
- Imprimer tableau excel sur une page - Guide
- Raccourci rouvrir onglet fermé - Guide
1 réponse
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.
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.
Je vais me lancer dans cette direction et je reviens en cas de soucis :)
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