Salut à tous,

J'ai un problème en javascript, je suis débutant dans ce language. J'ai deux fonctions dans <head></head> :

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
function visible(zone)
{
    if (document.layers)
    {
        document.layers[zone].visibility = 'show';
    }
    else if (document.all)
    {
        document.all[zone].style.visibility = 'visible';
    }
    else if (document.getElementById)
    {
        document.getElementById(zone).style.visibility = 'visible';
    }
}
 
function invisible(zone)
{
    if (document.layers)
    {
        document.layers[zone].visibility = 'hide';
    }
    else if (document.all)
    {
        document.all[zone].style.visibility = 'hidden';
    }
    else if (document.getElementById)
    {
        document.getElementById(zone).style.visibility = 'hidden';
    }
}
Ensuite, dans <body></body>, j'ai mis deux <div> et un bouton :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
		<div id="chargement" style="visibility: hidden;LEFT:650px;POSITION:absolute;TOP:400px;HEIGHT:20px"><table>
				<tr>
					<td><img src="images/grid/spinner.gif"></td>
					<td class="normaltext">Identification en cours...</td>
				</tr>
			</table>
		</div>
L'image spinner.gif est un gif annimé qui bouge.

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
<div id="corp"><DIV class="titre_souligne">Identification</DIV>
							<DIV class="normaltext_decale" align="center"></DIV>
							<DIV class="normaltext_decale" align="center">
								<TABLE id="Table2" cellSpacing="1" cellPadding="1" width="383" border="0">
									<TBODY class="normaltext">
										<TR>
											<TD>Nom d'utilisateur</TD>
											<TD>
												<asp:textbox id="TextBox1" tabIndex="1" runat="server" Width="100%"></asp:textbox></TD>
										</TR>
										<TR>
											<TD height="25">Mot de passe</TD>
											<TD height="25">
												<asp:textbox id="TextBox2" tabIndex="2" runat="server" Width="100%" TextMode="Password"></asp:textbox></TD>
										</TR>
										<TR>
											<TD vAlign="center" width="50%"><A class="normaltext" onmouseover="ChangeMessage('Cette mesure a pour but d\'accroître les performances et d\'empêcher l\'exécution de scripts automatisés non autorisés.','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')" href="#">Code 
													de sécurité</A>
											</TD>
											<TD vAlign="center" align="right">
												<DIV align="left">
													<TABLE id="Table3" cellSpacing="1" cellPadding="1" width="100%" align="left" border="0">
														<TR>
															<TD>
																<asp:image id="img" runat="server"></asp:image></TD>
															<TD>
																<asp:textbox id="code_verif" tabIndex="3" runat="server"></asp:textbox></TD>
														</TR>
													</TABLE>
												</DIV>
												<P align="left">Recopiez le code Recopiez le code ci-contre.</P>
											</TD>
										</TR>
										<TR>
											<TD width="50%" colSpan="2">
												<P align="center"><BR>
													<asp:CheckBox id="souvenir" onmouseover="ChangeMessage('Vous pouvez cocher cette case pour ne pas avoir à vous identifier lors de votre prochaine visite. Attention, ne pas utiliser cette case si vous vous trouvez sur un ordinateur public. Mes-Gestions.net ne serra pas responsable en cas d\'usurpation de vos identifiants.','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')" runat="server" CssClass="normaltext" Text="<a href=# class=normaltext>Se souvenir de moi</a>"></asp:CheckBox></P>
											</TD>
										</TR>
										<TR>
											<TD width="50%"></TD>
											<TD></TD>
										</TR>
										<TR>
											<TD colSpan="2">
												<P align="center">
													<asp:button id="Button1" runat="server" Text="Connexion"></asp:button></P>
											</TD>
										</TR>
									</TBODY></TABLE>
							</DIV>
							<DIV class="normaltext_decale" align="center"><A class="normaltext" href="conditions_inscription.aspx">Inscription</A>
								&nbsp;-&nbsp; <A class="normaltext" onclick="window.open('pop-up/perte_mdp.aspx' , 'exemple', 'height=140, width=320, top=100, left=100, toolbar=no, menubar=no, location=no, resizable=no, scrollbars=no, status=no, directories=no');" href="javascript:void(0);">
									Perte de mot de passe</A></DIV>
						</div>
					</div>
et le bouton :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
<input type="submit" name="Button1" value="Connexion" id="Button1" onclick="visible('chargement');invisible('corp')" />
Quand je clic sur le bouton, tout fonctionne correctement, le <div> nommé "chargement" apparait et le <div> nommé "corp" disparait. Le seul problème, c'est que mon gif animé qui bouge parfaitement à l'origine, quand je le fais apparaitre (quand apparaît le <div> "chargemen") ne bouge plus du tout... il reste fixé sur la première image, comme une simple image JPG...

Comment faire pour rectifier cette erreur ??? Pouvez-vous me proposer autre chose pour masquer/afficher des div ???

Merci de votre aide,

Jérôme