FAQ:affiche la réponse qd on clic sur la qst

hbhh -
BartWadela Messages postés 606 Statut Membre - 5 avr. 2008 à 21:40

Bonjour,

j'aimerais créer une FAQ un peu comme sur ce site:
https://www.hugedomains.com/domain_profile.cfm?d=geckozone&e=org#n1

C'est à dire, lorsque je clique sur une question, la réponse s'affiche. Lorsque je re-clique dessus, la réponse disparaît.

Quel est le code HTML / CSS pour cela?

Merci d'avance.

Configuration: Windows XP
Firefox 2.0.0.13

Afficher la suite

5 réponses

Réponse 1 / 5
hbhh

ou PHP! ou autres bien sûr...
0
Réponse 2 / 5
BartWadela Messages postés 606 Statut Membre 111

bonjour,

passe tes réponses avec des infobulles, a moins que tu ai 40 lignes de texte a mettre .. quoique ca peut aussi tenir

pour les fonctions de l'infobulle => CSS
pour plus d'infos => google => shadowblade css zéro

et hop site du zéro ; tuto
0

hbhh

euhh c'est quoi shadowblade??
je tape sur google, ça me trouve des profils seulement et sur le site du zéro il n'y a pas de tuto:(

sinon pour l'infobulle, ce n'ai pas vraiment ce que je recherche. regarde le lien que j'ai mis.
C'est exactement ça que je veux.

Merci d'avance.

BartWadela Messages postés 606 Statut Membre 111

c'est ça donc je voulais te parler : https://openclassrooms.com/fr/courses

sur geckozone

le .css de la page

  <style type="text/css">
	#infos { background-color: #e5ebf3; text-align: center; margin-bottom: 0.5em; }
	/*#infos span { float:right; }*/
	.abstract { color:#FFFFFF; background-color: #2E62AA; text-align: center;}
	.auteur {font-size: 0.7em; font-weight: normal; }
	h2 a, h3 a {text-decoration: none; color:#2E62AA; }
	h3 {border:0;}
	#controles {text-align: center;  }
	#controles form { display: inline; }
	#controles label { font-weight: bold; }
	#controles fieldset { display : inline; padding: 0; border: 0;}

  </style>

le .css du site :

body {
	font-family: Georgia, sans-serif;
	background-color: #F5F5F5;
}

#page {
	max-width: 100ex;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
	border: 1px solid #EAEAEA;
	padding-left: 2.5%;
	padding-right: 2.5%;
}

h1 {
	background: #e5ebf3; border: 1px solid #2E62AA; color: #2E62AA;
	text-align: center; padding: 0.5em;
}

h1 img { display:block; margin-left:auto; margin-right: auto; }

h2, h3 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	border-bottom: 1px solid #2E62AA;
	padding-bottom: 1px;
}

h2 { font-size: 1.3em; }
h3 { font-size: 1em; }

p, li {
	text-align: justify;
}

blockquote {
	font-style: italic;
}

q {
	quotes: "\AB\2009" "\2009\BB" "\201C" "\201D";
	font-style : italic;
}

p#modfooter {
	text-align: right;
	font-style: italic;
}

#footer { text-align:center; font-size: 0.7em; font-family: Verdana, Helvetica, Arial, sans-serif; color: #aaaaaa;}
#footer a { color: #999999; }

#menu {text-align: center; }

a img {border:0;}

dt {font-weight: bold;}

menu replié :

<h2>1. <a id="n1" href="index.php?chap=6&amp;voir=1#n1">La suite internet Mozilla 1.x</a></h2>
<h3>
1.1 <a id="n1.1" href="index.php?reponse_id=38&amp;voir=1&amp;chap=6#n1.1">Comment changer l'ordre de ses comptes dans Mozilla</a></h3>

menu deplié :

<h2>1. <a id="n1" href="index.php?chap=6&amp;voir=1#n1">La suite internet Mozilla 1.x</a></h2>
<h3>
1.1 <a id="n1.1" href="index.php?reponse_id=38&amp;voir=1&amp;chap=6#n1.1">Comment changer l'ordre de ses comptes dans Mozilla</a></h3>
<div class="reponse">
<p>Introduction.............................

ils ont utilisé le php pour gérer les différentes données, tu n'est pas obligé de faire pareil html + css devrait suffire

hbhh

ah oui pas mal le tuto sur l'infobulle!

tu peux me dire comment t'as trouvé le .css du site?? :s

et merci j'vais tester ça!

BartWadela Messages postés 606 Statut Membre 111

pour trouver le .CSS du site :

tu fais => clique-droit="afficher la source"

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
  <title>FAQ de geckozone</title>
  <link rel="stylesheet" href="../docs/geckodoc.css" type="text/css" />
  <style type="text/css">
	#infos { background-color: #e5ebf3; text-align: center; margin-bottom: 0.5em; }
	/*#infos span { float:right; }*/
	.abstract { color:#FFFFFF; background-color: #2E62AA; text-align: center;}
	.auteur {font-size: 0.7em; font-weight: normal; }
	h2 a, h3 a {text-decoration: none; color:#2E62AA; }
	h3 {border:0;}
	#controles {text-align: center;  }
	#controles form { display: inline; }
	#controles label { font-weight: bold; }
	#controles fieldset { display : inline; padding: 0; border: 0;}

  </style>
</head>

=> tu repere la balise css entre <head> et </head>

href="../docs/geckodoc.css"

=> tu fais un copier/coller du lien vers le fichier .css

 https://www.hugedomains.com/domain_profile.cfm?d=geckozone&e=org

 ../docs/geckodoc.css

ce qui donne :

 https://www.hugedomains.com/domain_profile.cfm?d=geckozone&e=org

et voila !!

Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Réponse 5 / 5
hbhh

Ah ouais c'est trop bienn!!! mercii!!!
0
1. BartWadela Messages postés 606 Statut Membre 111
  
  Y'a pas de koi
  
  alors tu t'en sors ??
  
  0

FAQ:affiche la réponse qd on clic sur la qst

5 réponses

Discussions similaires

Newsletters