[Javascript] Barre de chargement / progression

Version imprimable

13/12/2006, 12h11
Strix

[Javascript] Barre de chargement / progression

Bonjour.

J'ai beau cherché je ne trouve pas de barre de progression qui indiquerait le chargement d'une galerie et qui ensuite afficherait les Divs chargées.

Donc j'aimerais que quand on arrive sur une galerie, on voit le chargement puis l'affichage de mes divs.

Merci d'avance
13/12/2006, 12h22
Bisûnûrs

http://developpez.net/forums/showpos...4&postcount=60 ?
13/12/2006, 13h14
Strix

Citation:

Envoyé par Bisûnûrs

http://developpez.net/forums/showpos...4&postcount=60 ?

Bien tenté mais... non. enfin en tout cas j'en ai pas l'impression ! comment la barre évolue-t-elle seule pour indiquer le chargement des images ?
13/12/2006, 14h00
SpaceFrog

je l'ai fait sur deux de mes sites en recupérant la collection des images sur la page et en testant leur complete, et en incrémentant une variable si le complete est true ...

le rapport de la variable intégrée sur la longueur de la collection donne un pourcentage de chargement ...
13/12/2006, 15h55
Strix

Citation:

Envoyé par SpaceFrog

je l'ai fait sur deux de mes sites en recupérant la collection des images sur la page et en testant leur complete, et en incrémentant une variable si le complete est true ...

le rapport de la variable intégrée sur la longueur de la collection donne un pourcentage de chargement ...

Et où puis-je trouver les sources ? Parce que le Java et moi ça fait... hum... 10 :mouarf:

ça tombe bien ici c'est javascript ... Encore une fois rien à voir avec java !!!!!!
Brut de fonderie le code tel qu'il est aujourd'hui dasn mes pages ...
mais le principe est là ...

Code:

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
 
 
					testEnd=setInterval(function(){	
														//Verif image loaded
														var picsloaded=0;
														if (document.getElementById('termine')==null){	window.clearInterval(testEnd);
						                                                                          									GoPage(Nr);
						                                                                          									return;
																								     		    }
														var DocImages=document.getElementById('page2').getElementsByTagName('img')									     		    
														for (i=0;i<DocImages.length;i++){
																								    picsloaded+=(DocImages[i].complete)?1:0;	
																								    var TotalPics=DocImages.length
																								    var Lp= (picsloaded==TotalPics)?true:false;
																								    var PercentLoaded=(picsloaded/TotalPics);
																								    document.getElementById('progbar').innerHTML=Math.ceil(PercentLoaded*100)+"\%";
																								    }
 
 
 
                            									if(! ((document.getElementById('termine')!=null)&&Lp)){ window.clearInterval(testEnd);
						                                                                          GoPage(Nr);
						                                                                          //alert('termin?+document.getElementById('termine')!=null+'images '+Lp)
						                                                                          return;
																								     						}
														else {	
																if(ProductsLoaded){ window.clearInterval(testEnd);
 
																              document.getElementById('page1').style.display='none'; 
									   									   document.getElementById('page2').style.display='';
								   														self.location.href='#'+Nr
								   														document.getElementById('progbar').innerHTML="0\%"
								   														picsloaded=0
								   														PercentLoaded=0
								   														nofile=false;
 
								   			 											}
								   			 				document.getElementById('progbar').innerHTML="0%";
                                picsloaded=0;
                                //imageCount=0;  							
							 								document.getElementById('masque').style.display='none';
                                var Lp=false;							 									
 
																 }
 
														},500)
 
                      		}