Page web
jman
Messages postés
5
Statut
Membre
-
inizar Messages postés 217 Statut Membre -
inizar Messages postés 217 Statut Membre -
Bonjour,
j'utilise des pages web et firefox3.0 et ses extensions pour présenter des cours dans mon activité professionnelle. Je prépare ces pages avec Komposer. Voici mon problème : je souhaite faire apparaitre/disparaitre un paragraphe lorsque l'on clique sur son titre (de façon a avoir uniquement le plan du cours affiché et dérouler celui-ci au fur et à mesure de l'avancée de la leçon). Évidemment je souhaite un procédé le plus simple possible car appliqué sur plusieurs pages d'une même leçon.
Merci d'avance pour vos conseils.
j'utilise des pages web et firefox3.0 et ses extensions pour présenter des cours dans mon activité professionnelle. Je prépare ces pages avec Komposer. Voici mon problème : je souhaite faire apparaitre/disparaitre un paragraphe lorsque l'on clique sur son titre (de façon a avoir uniquement le plan du cours affiché et dérouler celui-ci au fur et à mesure de l'avancée de la leçon). Évidemment je souhaite un procédé le plus simple possible car appliqué sur plusieurs pages d'une même leçon.
Merci d'avance pour vos conseils.
A voir également:
- Page web
- Web office - Guide
- Supprimer page word - Guide
- Comment traduire une page web - Guide
- Screenshot page web entière - Guide
- Création page web - Guide
4 réponses
Je viens de te créer un exemple.
Bien sure que c'est le plus simple, mais c'est suite a ta demande.
Merci de copier ce code dans une page vierge et de tester
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans titre</title>
</head>
<script language="javascript">
function affichage(partie)
{
paragrapheid = 'paragraphe'+partie;
if (document.getElementById(paragrapheid).style.display == "none"){
document.getElementById(paragrapheid).style.display = "block";
}else if(document.getElementById(paragrapheid).style.display == "block"){
document.getElementById(paragrapheid).style.display = "none";
}
}
</script>
<body>
<div id="titre1" style="width:300px" onclick="affichage(1)"><a href="#">Titre paragraphe 1</a></div>
<div id="paragraphe1" style="width:300px; display:none">
Ceci est le texte du paragraphe 1<br />...
</div>
<div id="titre2" style="width:300px" onclick="affichage(2)"><a href="#">Titre paragraphe 2</a></div>
<div id="paragraphe2" style="width:300px; display:none">
Ceci est le texte du paragraphe 2<br />...
</div>
<div id="titre3" style="width:300px" onclick="affichage(3)"><a href="#">Titre paragraphe 3</a></div>
<div id="paragraphe3" style="width:300px; display:none">
Ceci est le texte du paragraphe 3<br />...
</div>
</body>
</html>
Bien sure que c'est le plus simple, mais c'est suite a ta demande.
Merci de copier ce code dans une page vierge et de tester
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans titre</title>
</head>
<script language="javascript">
function affichage(partie)
{
paragrapheid = 'paragraphe'+partie;
if (document.getElementById(paragrapheid).style.display == "none"){
document.getElementById(paragrapheid).style.display = "block";
}else if(document.getElementById(paragrapheid).style.display == "block"){
document.getElementById(paragrapheid).style.display = "none";
}
}
</script>
<body>
<div id="titre1" style="width:300px" onclick="affichage(1)"><a href="#">Titre paragraphe 1</a></div>
<div id="paragraphe1" style="width:300px; display:none">
Ceci est le texte du paragraphe 1<br />...
</div>
<div id="titre2" style="width:300px" onclick="affichage(2)"><a href="#">Titre paragraphe 2</a></div>
<div id="paragraphe2" style="width:300px; display:none">
Ceci est le texte du paragraphe 2<br />...
</div>
<div id="titre3" style="width:300px" onclick="affichage(3)"><a href="#">Titre paragraphe 3</a></div>
<div id="paragraphe3" style="width:300px; display:none">
Ceci est le texte du paragraphe 3<br />...
</div>
</body>
</html>
