changement de texte dans une partie de la page onmouveover sur un image

Version imprimable

Salut tout le monde !

je vous présente mon problème...
j'ai un menu en haut d'une page. En dessous, j'ai mis une bande (image) sur laquelle j'affiche un texte.
Le menu possède quatre images. au passage de la souris sur une image, je voudrais afficher un texte différent. Chaque texte affiché correspond à une image du menu.
Quand je passe le pointeur de la souris sur les images pour changer de rubrique, aucun texte ne s'affiche sur la barre en dessous. En gros, ca marche pas.

Alors voila mon code :

au debut du document :

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
<script language="javascript" type="text/javascript">
				function afficher(int etat){
					switch (etat){
  						case 0:
  						default:
    						message = "Présentation du Sommet Mondial de la Société de l'Information";
    						alert(message);
   							break;
  						case 1:
    						message = "SMSI - Genève 2003";
    						alert(message);
							break;
						case 2:
    						message = "SMSI - Tunisie 2005";
    						alert(message);
							break;
						case 3:
    						message = "SMSI - Suivi";
    						alert(message);
							break;
					}
				}
				function change_etat(int val){
					int etat;
					etat = val;
				}
		</script>

Code du menu :

Code:

1
2
3
4
5
6
7
8
9
10
<table width="100%"  height="40" border="0" align="center" cellpadding="0" cellspacing="0" background="...\image_background.gif"/>
      		<tr>
        		<td><p align="center"><a href=".../index.php">
					<img  src=".../image1.gif" 
					onmouseover="src='image_over1.gif' ;  change_etat(0)" 
					onmouseout="src='.../image1.gif'"	 border="0" />
					</a></p>
			</td> <!-- le bloc <td> est repete 4 fois avec 4 images diffrentes. La valeur de la fonction change_etat() est soit 0, soit 1, soit 2, soit 3 -->
                </tr>
</table>

Code de la barre en dessous :

Code:

1
2
3
4
5
6
7
8
<table  width="100%"  height="30" border="0" align="center" cellpadding="0" cellspacing="0" 
		background="...\image_background.gif"/>
			<tr>
        		<td colspan="4" align="center">
        			<script language="javascript" type="text/javascript"> afficher(etat));</script>
        		</td>
         		</tr> 
</table>

Merci de m'aider ;)

Pas de typages en javascript d'aprés ce que je crois, int val ça marche pas. Enfin pas chez moi. De plus tu avais déclaré etat dans une fonction, c'est pas trés pratique surtout si afficher est appelé avant.

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
 
<script language="javascript" type="text/javascript">
				var etat = 0;
				function afficher(etat){
					switch (etat){
  						case 0:
  						default:
    						message = "Présentation du Sommet Mondial de la Société de l'Information";
    						alert(message);
   							break;
  						case 1:
    						message = "SMSI - Genève 2003";
    						alert(message);
							break;
						case 2:
    						message = "SMSI - Tunisie 2005";
    						alert(message);
							break;
						case 3:
    						message = "SMSI - Suivi";
    						alert(message);
							break;
					}
				}
				function change_etat(val){
					etat = val;
				}
		</script>
 
</head>
 
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
</body></html>
<table width="100%"  height="40" border="0" align="center" cellpadding="0" cellspacing="0" background="...\image_background.gif"/>
      		<tr>
        		<td><p align="center"><a href="../index.php">
					<img  src=".../image1.gif" 
					onmouseover="src='image_over1.gif' ;  change_etat(0)" 
					onmouseout="src='.../image1.gif'"	 border="0" />
					</a></p>
			</td> <!-- le bloc <td> est repete 4 fois avec 4 images diffrentes. La valeur de la fonction change_etat() est soit 0, soit 1, soit 2, soit 3 -->
                </tr>
</table>
 
<table  width="100%"  height="30" border="0" align="center" cellpadding="0" cellspacing="0" 
		background="...\image_background.gif"/>
			<tr>
        		<td colspan="4" align="center">
        			<script type="text/javascript"> 
					afficher(etat);
				</script>
        		</td>
         		</tr> 
</table>

28/10/2006, 18h15
slim

Merci pour la réponse.

Ok pour la declaration. Tu as raison mais ca ne marche toujours pas.
Il ne me renvoie rien.
29/10/2006, 13h13
slim

en fait, ce qui ne marche pas, je crois, c'est les deux instructions de 'onmouseover'. Je crois que la premiere (affichage de l'image) est executée mais non la deuxieme.

Code:

onmouseover="src='image_over1.gif' ; change_etat(0)"

merci.

La solution :

dans le <head> :
Code:

1 2 3 4 5 6 7 8 <script language="javascript" type="text/javascript"> descr=new Array; descr[0]=""; descr[1]="Texte1"; descr[2]="Texte2"; descr[3]="Texte3"; descr[4]="Texte4"; </script>
Sur l'image cliquable :
Code:

1 2 onmouseover="document.getElementById('expl').innerHTML =descr[3]" onmouseout="document.getElementById('expl').innerHTML =descr[0]"
Et dans l'endroit ou on veut afficher le texte :

Code:

<div id="expl">Texte à afficher</div>

A+ ;)