Afficher, puis masquer un <div> ?

Version imprimable

Bonjour à tous,

:arrow: Mon JS :

Code:

1
2
3
4
5
6
7
8
9
10
<head>
	<SCRIPT LANGUAGE="JavaScript">
		<!--
		function masque(ident) {
			document.getElementById(ident).style.display = 'none';
		}
		//-->
	</SCRIPT>
	[...]
</head>

:arrow: Mon HTML :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div class="zone" id="un">
	<div id="loading_1"/>
	<span/>
	<xsl:apply-templates select="//zone[position()=1]"/>
	<script language="JavaScript">
		masque(loading_1);
	</script> 
</div>
 
[...]
 
<div class="zone" id="quatre">
	<div id="loading_4"/>
	<span/>
	<xsl:apply-templates select="//zone[position()=4]"/>
	<script language="JavaScript">
		masque("loading_4");
	</script> 
</div>

Où est l'erreur ? :?

Merci d'avance.

Gôm

En faisant uniquement comme ça, ça fonctionne, mais le code n'est pas très propre ! :?

:arrow: Mon HTML :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div class="zone" id="un">
	<div id="loading_1"/>
	<span/>
	<xsl:apply-templates select="//zone[position()=1]"/>
	<script language="JavaScript">
		document.getElementById("loading_1").style.display = 'none';
	</script> 
</div>
 
[...]
 
<div class="zone" id="quatre">
	<div id="loading_4"/>
	<span/>
	<xsl:apply-templates select="//zone[position()=4]"/>
	<script language="JavaScript">
		document.getElementById("loading_4").style.display = 'none';
	</script> 
</div>

Bon bah pour ceux que ça intéresseraient :

:arrow: HTML :

Code:

1
2
3
4
5
6
7
8
9
10
[...]
<!-- Apparition du <div> ! -->
<div id="loading">
	Chargement de la page en cours, merci de patienter.
</div>
[...]
<!-- A partir de maintenant le <div> doit disparaître ! ;-) -->
<script language="JavaScript">
	document.getElementById("loading").style.display = 'none';
</script>

:arrow: CSS :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#loading {
	z-index: 0;
	position: absolute;
	left: 50%;
	top: 50%;
	width: 320px;
	height: 40px;
	margin-left: -160px;
	margin-top: -20px;
	background-color: black;
	text-align: center;
	font: bold 1.2em/40px arial,verdana,serif;
	color: red;
	border: 2px dashed red;
}

Simple et facile ! :mouarf: