Discussion :

[fallais]

Bonsoir, je viens d'éplucher tous les topics à propos de ce problème, impossible de trouver d'ou vient mon problème

Je vous met les codes :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function sommaire()
{
	var cadre = document.getElementById(sommaire);
	var croix = document.getElementById(sommaireCroix);
 
	if(cadre.style.display == 'none' || cadre.style.display == '')
	{
		cadre.style.display = 'block';
		croix.innerHTML = '_';		
	}
	else
	{
		croix.innerHTML = 'X';
		cadre.style.display  = ''; 
	}
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#pageRubriqueBiere #sommaire
{
	width: 400px;
	margin: auto;
	margin-bottom: 40px;
	padding: 5px;
	background-color: #EEE;
	border: 1px #000 solid;
}
 
#pageRubriqueBiere #sommaire #sommaireCroix
{
	width: 20px;
	display: block;
	float: right;
	text-align: center;
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<div id="sommaire">
<a href="#" onclick="sommaire()" id="sommaireCroix">X</a>
<ul>
<li><a href="#histoire">Histoire</a></li>
<li><a href="#fabrication1">Fabrication</a>
	<ul>
	<li><a href="#composition">Composition de la bière</a>
		<ul>
		<li><a href="#eau">L'eau</a></li>
		<li><a href="#houblon">Le houblon</a></li>
		</ul>
	</li>
	<li><a href="#fabrication2">Fabrication en cinq grandes étapes</a>
		<ul>
		<li><a href="#maltage">Le maltage</a></li>
		<li><a href="#saccharification">La saccharification</a></li>
		<li><a href="#aromatisation">L'aromatisation ou houblonnage</a></li>
		<li><a href="#fermentation">La fermentation</a></li>
		<li><a href="#conditionnement">Le conditionnement</a></li>
		</ul>
	</ul>
<li><a href="#caracteristiques">Caractéristiques</a>
	<ul>
 
	</ul>
</li>
</li>
</ul>
</div>

Quand je clic sur la croix. Rien ne se passe. Vous pouvez vérifier ici

Merci d'avance =)

[nsanabi]

avec les guillemets que tu as oublié :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
	var cadre = document.getElementById("sommaire");
	var croix = document.getElementById("sommaireCroix");

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
else ...
cadre.style.display  = 'none';

[fallais]

Merci =)
Ça marche mieux mais pas encore exactement.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script type="text/javascript">
function sommaire()
{
	var sommaire = document.getElementById("sommaire");
	var sommaireCroix = document.getElementById("sommaireCroix");
 
	if(sommaireCroix.innerHTML == 'X')
	{
		sommaireCroix.innerHTML = '_';
		sommaire.style.height = 'auto';	
	}
	else
	{
		sommaireCroix.innerHTML = 'X';
		sommaire.style.height  = '15px'; 
		sommaire.style.overflow  = 'hidden'; 
	}
}
</script>

Il faut deux clics pour que le bloc se réduise. Le premier clic ne fait que changer le X en _. Bizarre.

[SpaceFrog]

avec un nom d'obet = nom de fonction comment veux tu qu'il retrouve ses petits ?

sommaire et sommaire() !!!

[fallais]

Toujours pas

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script type="text/javascript">
function sommaire()
{
	var varSommaire = document.getElementById("sommaire");
	var varSommaireCroix = document.getElementById("sommaireCroix");
 
	if(varSommaireCroix.innerHTML == 'X')
	{
		varSommaireCroix.innerHTML = '_';
		varSommaire.style.height = 'auto';	
	}
	else
	{
		varSommaireCroix.innerHTML = 'X';
		varSommaire.style.height  = '15px'; 
		varSommaire.style.overflow  = 'hidden'; 
	}
}
</script>

[SpaceFrog]

Dans le bon sens ça marche mieux

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<style type="text/css">
#pageRubriqueBiere #sommaire
{
	width: 400px;
	margin: auto;
	margin-bottom: 40px;
	padding: 5px;
	background-color: #EEE;
	border: 1px #000 solid;
}
 
#pageRubriqueBiere #sommaire #sommaireCroix
{
	width: 20px;
	display: block;
	float: right;
	text-align: center;
}
</style>
 
<script type="text/javascript">
function sommaire()
{
	var varSommaire = document.getElementById("sommaire");
	var varSommaireCroix = document.getElementById("sommaireCroix");
 
	if(varSommaireCroix.innerHTML == 'X')
	{
		varSommaireCroix.innerHTML = '_';
		varSommaire.style.height = '20px';	
		varSommaire.style.overflow  = 'hidden'; 
	}
	else
	{
		varSommaireCroix.innerHTML = 'X';
		varSommaire.style.height  = 'auto'; 
 
	}
}
</script>
</head>
 
<body>
<div id="sommaire">
<a href="#" onclick="sommaire();return false;" id="sommaireCroix">X</a>
<ul>
<li><a href="#histoire">Histoire</a></li>
<li><a href="#fabrication1">Fabrication</a>
	<ul>
	<li><a href="#composition">Composition de la bière</a>
		<ul>
		<li><a href="#eau">L'eau</a></li>
		<li><a href="#houblon">Le houblon</a></li>
		</ul>
	</li>
	<li><a href="#fabrication2">Fabrication en cinq grandes étapes</a>
		<ul>
		<li><a href="#maltage">Le maltage</a></li>
		<li><a href="#saccharification">La saccharification</a></li>
		<li><a href="#aromatisation">L'aromatisation ou houblonnage</a></li>
		<li><a href="#fermentation">La fermentation</a></li>
		<li><a href="#conditionnement">Le conditionnement</a></li>
		</ul>
	</ul>
<li><a href="#caracteristiques">Caractéristiques</a>
	<ul>
 
	</ul>
</li>
</ul>
</div>
</body>