18041 sujets

Questions générales et questions de débutants

Afficher les détails après un clic

Salut, je souhaite réaliser ceci:
J'ai une page avec des <li> contenant les jours de la semaine avec date (exple: Vend. 09),
et lorsque je clique sur un jour de la semaine, j'obtiens les détails du jour concerné; et les contenus des autres jours rentent masqués.
Voici le début du code:

<!doctype html>
<html id="html" lang="fr" xmlns:hx="http://purl.org/NET/hinclude" xmlns="http://www.w3.org/1999/html">
<head><title>prgme</title></head>

<body>

<div class="container">

<div class="prgme">
<ul>
<li>Lundi 04</li>
<li>Mardi 05</li>
<li>Mer. 06</li>
<li>Jeudi 07</li>
<li>Vend. 08</li>
<li>Sam. 09</li>
</ul>
</div>

<div class="prgmeDetails">
<div class="contenuDay"> Détails de Lundi: lorem dolor </div>

<div class="contenuDay"> Détails de Mardi: Sur lorem dolor </div>

<div class="contenuDay"> Détails de Mercredi: avec lorem dolor </div>

<div class="contenuDay"> Détails de Jeudi: Comme dolor </div>

<div class="contenuDay"> Détails de Vendredi: lorem realisé</div>

<div class="contenuDay"> Détails de Samedi: tu es mon espoir </div>
</div>

</div>


</body>
</html>

NB: Je Souhaite le faire en HTML & JAVASCRIPT.
upload/1504877974-67160-capture.png
Oui JENCAL , si tu peux m'aider à avoir le script puisque depuis là je cherche et rien de mon côté.
mon souhait par la suite sera de mettre tout cela dans ma DB
Le lien que tu donnes est bon mais il parle de menus ; j'ai fais le menu de la page et c'est OK.
Mais c'est que c'est dans le contenu de la page et non faire un menu JENCAL
Il s'agit d'un menu à onglet, de même que pour un topic voisin dans le forum.

Exemple : Tabs.

Le javascript : Github
Modifié par Olivier C (09 Sep 2017 - 08:54)
très intéressant Olivier C le Tabs mais je souhaite le faire avec HTML et JAVASCRIPT.
Regarde le post de début où se trouve l'image que j'ai joint.
Lorsqu'on cliquera sur un jour de la semaine, les détails affichent

S'il vous plait aidez moi car je ne maîtrise pas.
Sujet clos
Aller à