Div ne se masque pas

Version imprimable

Bon voila je débute en Javascript aucune honte à le dire, ci-dessou vous retrouverez mon code qui malheuresement ne fonctionne pas donc si quelqu'un a une piste à me donner ce serait cool.

Code:

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
 
 
<!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" xml:lang="fr" >
   <head>
       <title>Menu</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
       <link rel="stylesheet" media="screen" type="text/css" title="Design" href="Index.css" />
	   <script type="text/javascript" src="jquery-1.3.2.js"/></script>
<script type="text/javascript">
$(document).ready(function(){
 
 
$('.menu1).click(function(){
$('#laDivDeMonForm').hide();
$('#laDivDeMonAccueil').show();
});
$('.menu2).click(function(){
$('#laDivDeMonForm').show();
$('#laDivDeMonAccueil').hide();
});
 
});
</script>
   </head>
   <body>
 
<div id="Menu" >
 
<a href="" class="menu1" id="clic1" >test1<a>
<a href="" class="menu2" id="clic2" >test2<a>
 </div>
 
  <div id="Pages" >
 <div id="laDivDeMonAccueil">Wesh bienvenu t'as vu ici ton mon webcyte de ouf !</div>
<div id="laDivDeMonForm" style="display:none;">le contenu de ton formulaire ICI</div>
 </div>
 
</html>

Cordialement
Mephiston

17/11/2009, 15h04
E.Bzz

Bonjour,
si tu décrivais le problème, ça aiderait un peu :aie:

A+
17/11/2009, 15h24
mephiston

Le problème est que l'orsque je clic sur un de mes liens il ne se passe rien alors qu'il devrai cacher un div et rendre l'autre visible.
J'espère que c'est compréhensible.
17/11/2009, 15h28
E.Bzz

C'est peut être juste que ta page se recharge au même moment (href="") ...
Essaye de terminer ces fonctions click par un "return false;" pour inhiber le href.

A+
17/11/2009, 15h29
E.Bzz

... et un </body> serait bien pour l'équilibre de ta page :aie:

A+
17/11/2009, 15h30
mephiston

Merci c'est parfait.

Au final j'ai de nouveau un petit problème, avec mon nouveau code je n'ai pas la possibilité de cliquer sur ma div.

Je souhaite remplacer :

Code:

1
2
3
4
5
<div id="Menu" >
 
<a href="" class="menu1" id="clic1" >test1<a>
<a href="" class="menu2" id="clic2" >test2<a>
 </div>

Par :

Code:

1
2
3
4
5
<div id="Menu" >
 
<div id="imageAccueil" onclick="" class="menu1" ></div>
<div id="imageFormulaire" onclick="" class="menu2" ></div>
 </div>

Avec le CSS suivant :

Code:

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
#imageFormulaire
{
width: 75px;
height: 63px;
background: url(Images/AvantFormulaire.png);
position: relative; 
float: left; 
 
}
#imageFormulaire:hover
{
width: 75px;
height: 63px;
background: url(Images/ApresFormulaire.png);
position: relative; 
float: left; 
}
#imageAccueil
{
width: 64px;
height: 63px;
background: url(Images/AvantIndex.png);
position: relative; 
float: left; 
}
#imageAccueil:hover
{
width: 64px;
height: 63px;
background: url(Images/ApresIndex.png);
position: relative; 
float: left; 
}

17/11/2009, 15h52
E.Bzz

:koi:
Je vois pas le problème : tu n'as qu'à remplacer les identifiants dans la fonction d'attribution des fonctions click() ...
(et du coup, plus besoin du "return false;" :aie: )

A+
17/11/2009, 15h55
mephiston

Et comment faire pour que si la page est réinitialisée elle concerve les pages caché caché et les pages non caché non caché?
17/11/2009, 16h01
E.Bzz

Côté client, quand tu recharges, tu reviens à l'état initial ...

Essaye de passer par des variables serveurs (variables session).

A+
17/11/2009, 16h09
mephiston

J'avou n'avoir aucune idée de comment faire ce que tu me dis.

Bonsoir.
Attention, il manque des guillemets : ' !

Code:

1
2
3
4
5
6
7
8
9
10
$('.menu1').click(function(){
	$('#laDivDeMonForm').hide();
	$('#laDivDeMonAccueil').show();
});

$('.menu2').click(function(){
	$('#laDivDeMonForm').show();
	$('#laDivDeMonAccueil').hide();
});