Votre question

barre de chargement

Tags :
  • Script
  • Programmation
Dernière réponse : dans Programmation
5 Juillet 2005 13:58:41

bonjour , je voudrais faire une barre de chargement dan mon site(prochainement)
pouvez vous me dire le code pour une barre de chargement(html ou css) je pratique pas le PHP
merci d'avance :-P

Autres pages sur : barre chargement

5 Juillet 2005 14:19:04

Voici un exemple :

entre <head></head> :

  1. <*script language="JavaScript">
  2.  
  3. var ima1 = "image.png";// Indiquez ici l'adresse de l'image de la barre
  4.  
  5. var fond = "#000000";// Couleur de fond de la barre
  6. var couleur = "#FFFFFF";//Couleur de fond de la page de chargement
  7.  
  8. var scale = 3 // La taille de la barre est proportionelle a ce nombre
  9.  
  10. var tps = 5 // Temps de chargement en seconde
  11.  
  12. </script>



Insérer ce code entre les balises <Body> </Body>


  1. <*script language="JavaScript">
  2. var largeur = screen.width;
  3. var haut = ((screen.height/2)+80)/30;
  4. document.write('<div id="hidepage" style="position: absolute; left:0px; top:0px; background-color: '+ couleur +'; layer-background-color: '+couleur+'; height: 100%; width: '+largeur+';"> ');
  5. </script>
  6.  
  7. <*script language="JavaScript">
  8. var tps_inter = tps * 10;
  9. var ima2 = "";
  10. var imgsbefore = 0
  11. function pcgbar(pcg) {
  12. var totalbe = imgsbefore + 100
  13. if (pcg < totalbe) {
  14. document.images[pcg].src = ima1;
  15. newpcg = pcg + 1
  16. timerID=setTimeout('pcgbar(newpcg);',tps_inter);
  17. }
  18. else if (pcg == totalbe) {
  19.  
  20. if (document.getElementById) { // IE5, NS6
  21. document.getElementById('hidepage').style.visibility = 'hidden';
  22.  
  23. }
  24. else {
  25. if (document.layers) { // Netscape 4
  26. document.hidepage.visibility = 'hidden';
  27. }
  28. else { // IE 4
  29. document.all.hidepage.style.visibility = 'hidden';
  30.  
  31. }
  32. }
  33.  
  34. }
  35. }
  36.  
  37. if (document.images) {
  38. for (i=0;i<haut;i++){
  39. document.write("<br>");
  40. }
  41. document.write ('<center><font face="arial" color="" size="2"><b>Veuillez patientez, chargement de la page...</b><font><br><br><table border=1 cellspacing=0 cellpadding=0 bordercolor="#000000" bgcolor="'+fond+'"><tr><td>');
  42.  
  43. for (var i = 0; i < 100; i++) {
  44.  
  45. var width= 1 * scale
  46. var imgna = new Image()
  47. imgna.src = ima2;
  48. document.write ('<img border=0 src=ima2; width="' + width + '" height="20">');
  49. }
  50.  
  51. document.write ('</td></tr></table></center>');
  52.  
  53. var startpnt = imgsbefore
  54. pcgbar(imgsbefore);
  55.  
  56. }
  57. </script>
  58.  
  59. </div>
Contenus similaires
5 Juillet 2005 14:30:34

sa ne marceh pas j'ai essayer avec une page vierge
voici le code
ou est l'erreur?

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Bienvenue sur mon site !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<*script language="JavaScript">
var largeur = screen.width;
var haut = ((screen.height/2)+80)/30;
document.write('<div id="hidepage" style="position: absolute; left:0px; top:0px; background-color: '+ couleur +'; layer-background-color: '+couleur+'; height: 100%; width: '+largeur+';"> ');
</script>

<*script language="JavaScript">
var tps_inter = tps * 10;
var ima2 = "";
var imgsbefore = 0
function pcgbar(pcg) {
var totalbe = imgsbefore + 100
if (pcg < totalbe) {
document.images[pcg].src = ima1;
newpcg = pcg + 1
timerID=setTimeout('pcgbar(newpcg);',tps_inter);
}
else if (pcg == totalbe) {

if (document.getElementById) { // IE5, NS6
document.getElementById('hidepage').style.visibility = 'hidden';

}
else {
if (document.layers) { // Netscape 4
document.hidepage.visibility = 'hidden';
}
else { // IE 4
document.all.hidepage.style.visibility = 'hidden';

}
}

}
}

if (document.images) {
for (i=0;i<haut;i++){
document.write("<br>");
}
document.write ('<center><font face="arial" color="" size="2"><b>Veuillez patientez, chargement de la page...</b><font><br><br><table border=1 cellspacing=0 cellpadding=0 bordercolor="#000000" bgcolor="'+fond+'"><tr><td>');

for (var i = 0; i < 100; i++) {

var width= 1 * scale
var imgna = new Image()
imgna.src = ima2;
document.write ('<img border=0 src=ima2; width="' + width + '" height="20">');
}

document.write ('</td></tr></table></center>');

var startpnt = imgsbefore
pcgbar(imgsbefore);

}
</script>

</div>
</body>
</html>


merci de me repondre
5 Juillet 2005 14:43:11

tu vois quand c'est écrit :

<*script

il faut que tu enléve *

C'est parce que sur le forum on est obligé de la mettre pour pouvoir écrire le code !!!
5 Juillet 2005 15:23:23

sa marche merci mais je ne vois pas la barre
help pliz :-P
5 Juillet 2005 15:28:21

Il faut remplacer image.png par l'image de ta barre de chargement !!!

La par contre j'en ai pas, désolé !
5 Juillet 2005 15:30:06

Salut,

Si jamais tu ne trouves toujours pas, vas sur le site lediteurjavascript.com tu trouveras ton bonheur :) 
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS