Barre de progression : problème affichage

Version imprimable

Bonjour,

dans une application j'utilise une barre de progression sur l'évolution d'un traitement.

mais lorsque je precise que l'on est au début c'est à dire à 0% du traitement

Code:

width: 0%

ma barre affiche déja quelque chose comme si le traitement était déjà en cours

voici le code :

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
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>	
				<title>Génération des vignettes en cours</title>
				<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<style> 
                        .hidden{display:none;}
                    .visibleTransfertT{display:'';}
                        .hiddenTransfertT{display:none;}        
                        .visible{display:'';}                                   
                        .donneeLu{font-size :9pt;font-family: arial ;color: #C0C0C0 ;font-weight: bold}         
                </style>				
	</head>
	<body>
		<table border="0" height="100%" width="100%"> 
			<tr>
				<td style="text-align: center;" width="400"><span id="percentComplete" style="font-weight: bold; color: white; position: relative; top: 29px;">50.0%</span><br>
				</td>
			</tr>
			<tr id="progressBarTable" class="visible">	
				<td align="center" width="400">
					<table cellpadding=0 cellspacing=0 style="border: 1px none ; background-color: rgb(254, 226, 198); color: white;" border="1" bordercolor="#ff0000" width="200">
						<tr>
							<td  width="200" >
								<table id="progressBar" style="border: 1px none ; width: 0%; background-color: rgb(254, 162, 66);" width="0px">
									<tr>
										<td>&nbsp;</td>
									</tr>
								</table>
							</td>								
						</tr>						
					</table>					  						
				</td>
			</tr>
			<tr id="donneeT" class="visible">
				 <td align="center" nowrap="nowrap">
					<br><br><span id="bytesRead" class="donneeLu">0 sur 17 vignettes</span>
				</td>
			</tr>		
		</table>
	</body>
</html>

J'ai mis un aperçu du résultat en piece jointe.

Si quelqu'un a une explication je suis preneur ^^

merci

21/07/2009, 11h02
Vil'Coyote

salut,
je vois pas trop d'ou vient l'erreur cependant une question me taraude, tu compte faire une progresse bar sans javascript ?
21/07/2009, 11h38
link256

j'ai juste épuré le code de ma page :P

le javascript est en place avec XLMRequest pour mettre à jour la barre de progression.

ce qui me bloque c'est ce maudit zero 0% éronné
21/07/2009, 12h14
Vil'Coyote

je pense qu'il faudrais le code complet pour mieux répondre.

via l'XMLRrequest et ma fonction javascript je ne modifie que la propriété suivante:

Code:

document.getElementById("progressBar").style.width = pourcentageCree + "%";

où pourcentageCree est la valeur associée et récupérée d'un flux XML.

je tente une seconde solution en m'inspirant du code d'ajout de pièce jointe du forum :
Code:

1 2 3 4 5 6 <table width="200" style="border:2px groove" bordercolor="#FF8000" cellpadding="0" cellspacing="0" > <tr> <td width="0%" bgcolor="#FEA242" id="progressBar" style="border:1px outset;width: 0px"> </td> <td width="100%" bgcolor="#FEE2C6" style="border:1px outset"> </td> </tr> </table>
j'ai le même symptome IE/Firefox seule solution retirer les nbsp; et précisé une hauteur pour la TR

edit : fausse joie sans les nbsp; même résultat :piou:
edit2 : en passant d'une bordure outset à hidden le problème ne se pose plus
c'est un peu du bricolage mais sa marche.

Code:

style="border:1px hidden;width: 0px"