begin process at 2010 03 22 11:05:54
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Navigation

 > CHARGEMENT AVEC UNE BARRE DE POURCENTAGE (VRAI)

CHARGEMENT AVEC UNE BARRE DE POURCENTAGE (VRAI)


 Information sur la source

Note :
6,33 / 10 - par 6 personnes
6,33 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Navigation Niveau :Initié Date de création :22/07/2004 Vu :24 051
Auteur : yanndroniou

Ecrire un message privé
Commentaire sur cette source (16)
Ajouter un commentaire et/ou une note

 Description

Chargement avec un pourcentage est une barre, Chargement en fonction des images disposées sur la page.

Source

  • <div id="Load" style="position:absolute"><br></div>
  • <script type="text/javascript" langage="JavaScript">
  • ///// Option /////
  • MaxImgLoad=3; //Nombre d Image
  • Time=2000 // en MiliSecondes
  • Taille=120 // en Pixel
  • Color="#006699" // couleur de la barre
  • /// Fin Option ///
  • ImgLoad=-1;
  • function Chargement(){
  • ImgLoad++;
  • Pourcentage=Math.round((100/MaxImgLoad)*ImgLoad);
  • PourcentageBarre=Math.round((Taille/100)*Pourcentage);
  • document.all.Load.innerHTML="<table border=1 style='border-style:none;width:"+Taille+"'><tr><td><center><font size=2>Chargement : <font size=4>"+Pourcentage+"%</font></center><div style='background-color:"+Color+";width:"+PourcentageBarre+"px'</div></td></tr></table>";
  • if(Pourcentage>=100){
  • setTimeout('document.all.Load.innerHTML=""',Time)
  • }
  • }
  • Chargement()
  • </script>
  • <body>
  • <img src="Img1" onLoad="Chargement()">
  • <img src="Img2" onLoad="Chargement()">
  • <img src="Img3" onLoad="Chargement()">
<div id="Load" style="position:absolute"><br></div>
<script type="text/javascript" langage="JavaScript">
///// Option /////
MaxImgLoad=3; //Nombre d Image
Time=2000 // en MiliSecondes
Taille=120 // en Pixel
Color="#006699" // couleur de la barre
/// Fin Option ///
ImgLoad=-1;
function Chargement(){
ImgLoad++;
Pourcentage=Math.round((100/MaxImgLoad)*ImgLoad);
PourcentageBarre=Math.round((Taille/100)*Pourcentage);

document.all.Load.innerHTML="<table border=1 style='border-style:none;width:"+Taille+"'><tr><td><center><font size=2>Chargement : <font size=4>"+Pourcentage+"%</font></center><div style='background-color:"+Color+";width:"+PourcentageBarre+"px'</div></td></tr></table>";
if(Pourcentage>=100){
setTimeout('document.all.Load.innerHTML=""',Time)
}
}

Chargement()
</script>

<body>
<img src="Img1"  onLoad="Chargement()">
<img src="Img2"  onLoad="Chargement()">
<img src="Img3"  onLoad="Chargement()">

 Conclusion

Sur toute les images maitez : onLoad="Chargement()" . Et noubliez pas de changer le nombre d'images


 Sources du même auteur

DATE HEURE UTC
Source avec Zip Source avec une capture DANCING FINGERS V1.3
Source avec Zip ALARME ET MESSAGE
LES NOM DES COULEURS
TOUT SUR LES COOKIES
Toutes les sources de yanndroniou

 Sources de la même categorie

Source avec Zip EMULATION DE $_GET() DU PHP par jchan
Source avec Zip ACCESSIBARRE - AMÉLIORER LE CONFORT DES PERSONNES NON-VOYANT... par Pfuch
Source avec Zip CLASS BARRE DE DÉFILEMENT (SCROLLBAR) JAVASCRIPT par TheWeasel47
Source avec une capture TAILLEFONTE par tiger222
Source avec Zip Source avec une capture MOTEUR DE RECHERCHE SANS PHP par jdmcreator
Toutes les sources de la catégorie Navigation

Commentaires et avis

Commentaire de sarl_adc le 23/07/2004 11:22:00

J'aime bien ta barre de progression !
Assez pratique.

Petit bémol, quand tu as un site fait à 100% d'images, la barre disparait sous les images et/ou autres objets DIV (parfois au début du chargement)...

Mais il doit y avoir moyen de trouver une solution pour ça :-)

Commentaire de Jsman le 23/07/2004 12:30:23

A mon avis, faudrait la mettre dans un div avec un très grand z-index...

Sinon, bravo. :)

Commentaire de pyroflo le 23/07/2004 20:41:40

Ton script n'est compatible que sous IE.

document.all....

:)

Commentaire de Dori66 le 29/07/2004 12:59:37

Ton script est super !

Dommage qu'il ne fonctionne pas correctement: La barre commence, mais arrivée à 100%, elle continue.. lol 600%...1000%... mdr

Si tu as une solution pour arrêter ça, merci !

Commentaire de junior447 le 29/07/2004 14:05:55

pour Netscape 4 il faut mettre ceci :

document.Load.document.open();
document.Load.document.write(message);
document.Load.document.close();

à la place de document.all.Load.innerHTML = message;

avec message = "<table border=1 style='border-style:none;width:"+Taille+"'><tr><td><center><font size=2>Chargement : <font size=4>"+Pourcentage+"%</font></center><div style='background-color:"+Color+";width:"+PourcentageBarre+"px'</div></td></tr></table>";

voilà ;)

Commentaire de coucou747 le 31/07/2004 22:12:41

document.getbyid...
t'as un truc comme ça qui doit fonctionner partout.
et document.all fonctionne aussi sous konqueror.
ARRTEZ DE FAIRE DES SCRIPTS NON TESTE SOUS AUTRES QUE IE !!! IE NE RESPECTE PAS LA NORME !!!

Commentaire de Jsman le 01/08/2004 12:21:49

document.getElementById('divd').

Ca marche super bien...

C'est vrai qu'on a l'impression que ie et ses créateurs on vraiment envie de tuer des conventions qui ont du mal à s'implenter

Surtout qu'ils est utilisé par plus de 80% de la population...

Commentaire de coucou747 le 01/08/2004 12:25:46

Sur le site de mozilla, on dit que mozilla fait 19% des navigateurs web, sur un site clairement pour les os propriétaires (se placant du coté du vainceur sans vaincu) dit que ie est utilisé par 98 % de la population, et j'ai un book aussi qui confirme les 98 % malheureusement, parfois, ie interdit certains noms de variables, certains noms de fonctins de noms ... alors que ces noms devraient êtres utilisables

Commentaire de Jsman le 01/08/2004 15:55:05

En fait les 80 % , je les ai d'un site qui faisait un sondage

(80% IE, 16% Autres, 4% Netscape)

Commentaire de pyroflo le 01/08/2004 15:58:08

Un sondage auquel on peut se fier sans problème :

http://www.w3schools.com/browsers/browsers_stats.asp

:)

Commentaire de coucou747 le 01/08/2004 16:10:20

bah si tu veux, on n'aura jamais les chiffres exacts, tu pourais facilement avoir les porcentages pour les passages sur ton site, mais jamais vraiment...

Un linuxois ira sur linuxfr.org bien plus souvent qu'un windowsien, un linuxois ira moins souvent sur hotmail qu'un windowsien... ect...

On ne peut pas avoirde chifres et on ne peut pas se servir de chifres, metez un compteur avec statistiques en php sur votres site vous verrez exactements quel genre de public vous atirez, mais bon, vous ne pourez pas avoir exactement tout ça, et franchemet, seulement 70 % pour ie, je suis étonné... Dans mon lycé, on est que deux sous linux, et je suis le seul a n'utiliser que linux...

Commentaire de FlaViMaN le 25/12/2005 02:42:06

y a un probleme ... la barre de progression continu ... 100 200 400 600 .. 1000 bref sa sarrete pa ?alor k limage el est deja affiché :S

Commentaire de wizard512 le 16/04/2006 00:32:33

pour ceux qui ce demande pourquoi esque la bar de progression continus 120%, 150%, ....
c'est tout simplement parceque vous n'avait pas définit la bonne valeur des images charger (MaxImgLoad) vous avez plus d'images

Commentaire de scylla77 le 19/09/2007 23:18:09

Salut,
j'ai conçu mon site en utilisant ce code qui marche très bien sous IE,
surtout comparé aux autres code que j'ai trouvé,
mais sous firefox, ça marche pas du tout, je pense que le problème vient de
document.all.Load.innerHTML qui n'est pas compatible..
j'ai beau remplacer cette ligne, cela marche toujours pas,
et croyez mois j'y suis depuis un petit moment dessus...
si quelqu'un a une idée.....??

Commentaire de val3512 le 25/11/2007 14:33:27

ouai , ca ne s'arrete pas .

je vais essayer de continé a regarder ce truc ... c'est bizard ..

Commentaire de val3512 le 25/11/2007 14:33:46

aucue faille sur le truc pourtant

 Ajouter un commentaire

Nos sponsors


Sondage...

CalendriCode

Mars 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,312 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)