[Javascript] Comment afficher un message chargement en cours patientez ?

**loady** · 25/03/2006, 03h04

Bonjour,

Voila, j'ai sur une page un fichier qui est assez long à monter et je voudrais afficher un petit message d'attente sur la page genre "chargement de la page patientez .... " et qui disparait dès que la page s'affiche. Commment puis je faire ca ?

**Kerod** · 25/03/2006, 04h10

Avec du Js ca devrait pouvoir faire l'affaire, non ?!*
J'avais fait un truc comme ca ou je cachait avec un div qui contenait mon message et le reste de la page en hidden...Et après un certain temps je désactivais mon message et remettait la propriété à visible.

Mon bon peut etre qu'il y a plus simple

**macbook** · 25/03/2006, 09h18

Ou bien en ajax puisqu'on ne peut le faire qu'en javascript : tant que readyState est inférieur à 4 tu affiche 'Chargement...'.

**loady** · 25/03/2006, 23h10

Hello,

Merci pour votre réponse, mai vous auriez pas un exemple concret en javacript ou ajax ? J'avoue que je vois pas bien.

Merci

**steph1** · 25/03/2006, 23h35

Salut,

voici un exemple qui marche bien

Le code à mettre juste après ta balise <BODY>

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<div id="waitDiv" style="position:absolute;left:432;top:276;visibility:hidden">
<center><font color="#FF0000" face="Verdana, Arial, Helvetica, sans-serif" size="3"><b>Page en cours de chargement...</b></font><P>
<font size="2">Merci de patienter</font><br><img src="./images/polling2.gif"</center></div> 
<SCRIPT> <!-- 
var DHTML = (document.getElementById || document.all || document.layers);
function ap_getObj(name) { if (document.getElementById) { return document.getElementById(name).style; } else if (document.all) { return document.all[name].style;
} else if (document.layers) { return document.layers[name]; } } function ap_showWaitMessage(div,flag) { if (!DHTML) return; var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden'
if(! document.getElementById) if(document.layers) x.left=280/2; return true; } ap_showWaitMessage('waitDiv', 1); 
//--> </SCRIPT>

Le code à mettre juste avant ta balise </BODY>

Code :

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

1
2
3
4
 
<SCRIPT language="javascript"> <!-- 
ap_showWaitMessage('waitDiv', 0);
//--> </SCRIPT>

Pour bien te former: Cours et tutoriels pour apprendre JavaScript

**loady** · 27/03/2006, 04h38

MERCI a tous et speciale dedicace pour STEPH1 8)

**kilian67** · 15/02/2008, 21h12

Envoyé par steph1

Salut,

voici un exemple qui marche bien

Le code à mettre juste après ta balise <BODY>

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<div id="waitDiv" style="position:absolute;left:432;top:276;visibility:hidden">
<center><font color="#FF0000" face="Verdana, Arial, Helvetica, sans-serif" size="3"><b>Page en cours de chargement...</b></font><P>
<font size="2">Merci de patienter</font><br><img src="./images/polling2.gif"</center></div> 
<SCRIPT> <!-- 
var DHTML = (document.getElementById || document.all || document.layers);
function ap_getObj(name) { if (document.getElementById) { return document.getElementById(name).style; } else if (document.all) { return document.all[name].style;
} else if (document.layers) { return document.layers[name]; } } function ap_showWaitMessage(div,flag) { if (!DHTML) return; var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden'
if(! document.getElementById) if(document.layers) x.left=280/2; return true; } ap_showWaitMessage('waitDiv', 1); 
//--> </SCRIPT>

Le code à mettre juste avant ta balise </BODY>

Code :

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

1
2
3
4
 
<SCRIPT language="javascript"> <!-- 
ap_showWaitMessage('waitDiv', 0);
//--> </SCRIPT>

Bonsoir je vient de tester ce script mais lorsque la page a fini de charger le texte reste en fond d'écran au lieu de disparaître.

Quelqu'un a t'il une solution ?

**javatwister** · 16/02/2008, 09h26

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
 
onload=function(){
document.body.removeChild(document.getElementById("mess"));
 
</script>
 
<body>
   <h1 id="mess">
      Veuillez patienter...
   </h1>

**kilian67** · 17/02/2008, 11h24

Merci javatwister le message s'affiche bien mais reste a l'écran malgré la fin du chargement de la page !

**javatwister** · 17/02/2008, 11h44

étonnant, si tu lui donnes bien l'id "mess" et que ton document est composé normalement;
tu peux me montrer le code correspondant dans ta page?

**kilian67** · 17/02/2008, 11h49

C'est a peut pres ça

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<html><head><script type="text/javascript">
 
onload=function(){
document.body.removeChild(document.getElementById("mess"));
 
</script>
</head>
<body bgcolor="#CCCCCC" text="black" link="#3399FF" vlink="#3399FF" alink="#3399FF">
<h1 id="mess">
      Veuillez patienter...
   </h1>

**javatwister** · 17/02/2008, 12h12

ah ben j'ai mis de crochet de fin de fonction

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
<script type="text/javascript">
 
onload=function(){
   document.body.removeChild(document.getElementById("mess"));
}
 
</script>
 
<body>
   <h1 id="mess">
      Veuillez patienter...
   </h1>

**kilian67** · 17/02/2008, 13h53

Merci javatwister ça fonctionne à merveille maintenant.
De plus ton code est bien plus simple (et moins long) que tous ceux que j'ai déjà tester jusqu'à maintenant.

[Javascript] Comment afficher un message chargement en cours patientez ?

JavaScript

Discussions similaires

Partager

Partager