upload d'image et verification d la taille (hauteur/largeur) [Sources]

**NoobX** · 19/12/2005, 17h10

J'ai fais comme tu m'a expliquer et affectivement tous semble se passer comme il faut

Je te remercie pour ta patience

Je laisse ouvert ce sujet afin de me laisser quelques jours pour vérifier qu"il n'y est plus de probleme !

Merci beaucoup

**NoobX** · 24/12/2005, 15h54

bonjour @ tous !

bon, apres differents tests je constate que le script que je tente d'utiliser n'est toujours pas fiable @ 100% !

Si vous avez la moindre idée n'hesitez surtout pas !

merci et bonnes fetes @ tous

**siddh** · 24/12/2005, 16h50

c est quoi le probleme qui fait que ce n est pas fiable ?

**NoobX** · 24/12/2005, 18h14

Salut

en fait souvent la premiere image que je test meme si elle est top grande elle est quand meme acceptée

ou sinon parfois (moins frequent) aucune image n'est accepté

mais si elle est de bonne taille !

95% du temps tout va bien mais les 5 % me rendent dingo !

merci

**siddh** · 24/12/2005, 18h55

si c est une erreur aleatoire on y peut pas grand chose malheureusement, il faudrais arriver a savoir les raisons qui font que ca ne marche pas

**NoobX** · 12/01/2006, 12h18

bonjour @ tous !!

bon aprés de longues recherches et de nombreux test j'ai réussi (en apparence au moins) à résoudre certain probleme !

Je post mon script afin de le soumettre à vos yeux d'expert

Code :

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

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
<html> 
<head> 
 <script type='text/javascript'> 
       function verif(val){ 
      im = document.getElementById('monimg'); 
      cont = document.getElementById('container'); 
      im.src = val.value; 
 
     if ((document.images["tjs_img"].height>29 || document.images["tjs_img"].width>26)){ 
msg="La hauteur maximum du logo est de : 29 \net la hauteur de votre logo est de  : "+document.images["tjs_img"].height 
msg+="\n \nLa largeur maximum du logo est de : 26 \net la largeur de votre logo est de : "+document.images["tjs_img"].width 
msg+="\n \nVEUILLEZ MODIFIER LES DIMENSIONS \n                DE VOTRE LOGO" 
alert(msg); 
 
 
 
  val2 = document.createElement("input"); 
         val2.type = "file"; 
         val2.name= "logo"; 
         val2.onchange = function(){ 
            verif(this); 
 
           } 
         val.parentNode.replaceChild(val2,val); 
         im.src = ""; 
 
   } }  
 
 
    </script> 
</head> 
<body> 
            <input name="logo" type="file" size="20" maxlength="40" onchange="verif(this)"> 
          </div> 
          <div id="container"> 
            <div align="center"><img id="monimg" alt="test de votre logo" src="" name="tjs_img"/> 
</div></div> 
</body> 
</html>

Si vous remarquez des problemes eventuels ou des améliorations possibles je suis à votre écoute

en tous cas merci et bonne continuation

ps: un des avantages de ce script par rapport au premier réaliser est que les dimensions sont xacts à présent

**SpaceFrog** · 12/01/2006, 13h33

avant de recupérer les dims offset des images, sont elles complete ?

**NoobX** · 12/01/2006, 14h16

salut spacefrog

ta remarque est tres certainement interressante mais j'avoue :
J'ai rien compris

dsl

pourrais tu preciser un peu ton idée STP !

Tu me demande si lors de la vérif l'image est comlpete en fait ?!?
Je ne sais pas te repondre en revanche dans certains cas l'image est acceptée alors qu'elle ne devrait pas (trop grande)
peut-etre que ce "bug" rejoind ta question !

on est noob ou on l'est pas , moi je le suis lol

ps: tu reconnais certainement un ti' bout de script que tu m'a expliquer hier

**SpaceFrog** · 12/01/2006, 14h19

ben fais un test sur le complete de l'image ...

il y a un pôst qui parle d'images chargées d'il y a deux ou trois jours ...

**NoobX** · 12/01/2006, 15h04

bon alors objectif :

combiner ce script

Code :

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

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
<script type='text/javascript'> 
 var timer1 
 
function wait4images(){ 
   var NrLoaded=0 
   imageTab=document.getElementsByTagName('img') 
   for(i=0;i<imagetab.length;i++) 
    {NrLoaded+=(imagetab[i].complete)?1:0;} 
 
    if (NrLoaded==imageTab.length){   clearInterval(timer1); 
                                  for(i=0;i<imagetab.length;i++){ 
                                                             imageTab[i].style.visibility="visible" 
                                                           } 
                               } 
}                                         
 
 
function TestLoading(){ 
timer1=setInterval(function(){wait4images()},10) 
 } 
</script> 
 
</head> 
 
<body onload="TestLoading()"> 
 
<img src="image1.gif" style="visibility:hidden;" /> 
<img src="image2.gif" style="visibility:hidden;" /> 
 
 
</body> 
</html>

avec mon script ci-dessous afin de s'assurer que la vérif s'effectue bien une ois que l'image est complete

Code :

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

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
<html>
<head>
 <script type='text/javascript'> 
       function verif(val){ 
      im = document.getElementById('monimg'); 
      cont = document.getElementById('container'); 
      im.src = val.value; 
 
	  if ((document.images["tjs_img"].height>16 || document.images["tjs_img"].width>672)){
msg="La hauteur maximum du logo est de : 16 \net la hauteur de votre logo est de  : "+document.images["tjs_img"].height
msg+="\n \nLa largeur maximum du logo est de : 672 \net la largeur de votre logo est de : "+document.images["tjs_img"].width
msg+="\n \nVEUILLEZ MODIFIER LES DIMENSIONS \n                DE VOTRE LOGO"
alert(msg);
 
 
 
  val2 = document.createElement("input"); 
         val2.type = "file"; 
         val2.name= "logo"; 
         val2.onchange = function(){ 
            verif(this); 
 
			  } 
         val.parentNode.replaceChild(val2,val); 
         im.src = ""; 
 
   } }  
 
 
    </script> 
</head>
<body> 
            <input name="logo" type="file" size="20" maxlength="40" onchange="verif(this)">
          </div>
          <div id="container"> 
            <div align="center"><img id="monimg" alt="test de votre logo" src="" name="tjs_img"/> 
</body>
</html>

et bah c'est pas gagner lol

lol

**SpaceFrog** · 12/01/2006, 15h06

fingers in the nose ...

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
<script type='text/javascript'>
 var timer1
 
function wait4images(){
   var NrLoaded=0
   imageTab=document.getElementsByTagName('img')
   for(i=0;i<imagetab.length;i++)
    {NrLoaded+=(imagetab[i].complete)?1:0;}
 
    if (NrLoaded==imageTab.length){   clearInterval(timer1);
                                 //ici tu récupères les offset dims ...
                               }
}

en prenant soin de lancer la focntion dans le onload ...

**NoobX** · 13/01/2006, 14h13

bonjour @ tous !

apres de nombreux essais j'obtiens systematiquement

une erreure !

mais j'ai remarqué que meme en utilisant intégralement le script (de SpaceFrog) ci dessous

Code :

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

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
<script type='text/javascript'> 
 var timer1 
 
function wait4images(){ 
   var NrLoaded=0 
   imageTab=document.getElementsByTagName('img') 
   for(i=0;i<imagetab.length;i++) 
    {NrLoaded+=(imagetab[i].complete)?1:0;} 
 
    if (NrLoaded==imageTab.length){   clearInterval(timer1); 
                                  for(i=0;i<imagetab.length;i++){ 
                                                             imageTab[i].style.visibility="visible" 
                                                           } 
                               } 
}                                          
 
 
function TestLoading(){ 
timer1=setInterval(function(){wait4images()},10) 
 } 
</script> 
 
</head> 
 
<body onload="TestLoading()"> 
 
<img src="image1.gif" style="visibility:hidden;" /> 
<img src="image2.gif" style="visibility:hidden;" /> 
 
 
</body> 
</html>

j'ai aussi une erreure si vous pouviez me situé l'erreure je pourrai peut-etre comprendre le probleme dans mon script
merci

**siddh** · 13/01/2006, 14h23

et en utilisant le onload de l'image ?

Code :

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

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
 
<html>
<head>
 <script type='text/javascript'>
	function verif(val){
		im = document.getElementById('monimg');
		cont = document.getElementById('container');
		im.src = val.value;
		im.onload = function(){
			if ((this.height>29 || this.width>26)){
				msg="La hauteur maximum du logo est de : 29 \net la hauteur de votre logo est de  : "+this.height
				msg+="\n \nLa largeur maximum du logo est de : 26 \net la largeur de votre logo est de : "+this.width
				msg+="\n \nVEUILLEZ MODIFIER LES DIMENSIONS \n                DE VOTRE LOGO"
				alert(msg);
				val2 = document.createElement("input");
				val2.type = "file";
				val2.name= "logo";
				val2.onchange = function(){
					verif(this);
				}
				val.parentNode.replaceChild(val2,val);
				this.src = "";
 
			} 
		} 
	}
    </script>
</head>
<body>
            <input name="logo" type="file" size="20" maxlength="40" onchange="verif(this)">
          </div>
          <div id="container">
            <div align="center"><img id="monimg" alt="test de votre logo" src="" name="tjs_img"/>
</div></div>
</body>
</html>

**NoobX** · 13/01/2006, 14h53

bonjour siddh !

j'ai testé ta proposition et j'ai remarqué que toutes les 3 ou 4 images (si elles sont trop grandes) le script plante a :

Code :

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

1
2
3
4
5
6
 alert(msg); 
            val2 = document.createElement("input"); 
            val2.type = "file"; 
            val2.name= "logo"; 
            val2.onchange = function(){ 
               verif(this);

Ce qui permet de d'effacer la source de l'image !

ce qui se produit:
le message comme quoi l'image est trop grande apparait puis on clic sur ok mais là l'image reste a l'ecran et le input conserve l'adresse de cette image donc si le visiteur valide l'image passera quand meme alors qu'elle est 10 fois trop grande !

comment corriger cela ? svp (tout du moins essayer)

**siddh** · 13/01/2006, 15h21

bon j'ai fait pas mal de modifications :
- deux images, une pour afficher en miniature et l'autre pour calculer.
- plus de alert mais un innerHTML

Code :

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

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
49
50
51
52
53
54
 
<html>
<head>
 <script type='text/javascript'>
	var im,log;
 
	function verifIm(){
 
			if ((im.height>29 || im.width>26)){
				msg="La hauteur maximum du logo est de : 29 <br />et la hauteur de votre logo est de  : "+im.height
				msg+="<p>La largeur maximum du logo est de : 26 <br />et la largeur de votre logo est de : "+im.width
				msg+="</p><p>VEUILLEZ MODIFIER LES DIMENSIONS DE VOTRE LOGO</p>"
 
				val2 = document.createElement("input");
				val2.type = "file";
				val2.name= "logo";
				val2.id= "logo";
				val2.onchange = function(){
					verif();
				}
				log.parentNode.replaceChild(val2,log);
				log = val2;
				im.src = "";
				document.getElementById('errmess').innerHTML = msg;
 
				}		
	}
 
	function verif(){
		document.getElementById('errmess').innerHTML = '';
		cont = document.getElementById('container');
 
		im.onload = function(){setTimeout("verifIm()",500);}
 
		im2.src = log.value;
		im.src = log.value;
	}
	window.onload = function(){
		im = document.getElementById('monimg');
		im2 = document.getElementById('miniimg');
		log = document.getElementById('logo');
	}
    </script>
</head>
<body>
			<div id='errmess' style='color:red;font-weight:bold;font-size:bigger'></div>
            <input name="logo" type="file" id='logo' size="20" maxlength="40" onchange="verif()" onclick="im2.src=''">
          </div>
		  <div style="width:0px;height:0px;overflow:hidden"><img id="monimg" alt="test de votre logo" src="" name="tjs_img"/></div>
          <div id="container">
            <div align="center"><img id="miniimg" style="width:100px;" alt="test de votre logo" src="" name="min_img"/>
</div></div>
</body>
</html>

**NoobX** · 13/01/2006, 15h45

deja merci pour le boulot que tu as fait

Ensuite, il me semble que cette fois ci (je croise les doigts) il n'y a plus de probleme et cela fonctionne à tous les coups

Je me pose 2 questions la premiere et la plus simple je pense :

lorsque l'image est trop grande le message s'affiche bien le input se vide de l'adresse mais l'image reste affichée est il possible de la faire disparaitre? comme avec l'ancien script

merci

pour ma 2eme questions on verra ca apres car ca va etre plus compliqué !

**siddh** · 13/01/2006, 16h05

ben le truc c est que si on la fait disparaitre, tu la verras jamais en fait

la on l'enlève en recliquant sur le bouton

ou alors rajoutes un setTimeout qui remettra im2.src a ''

**NoobX** · 13/01/2006, 16h37

OK bon
laisson ca de coté pour le moment !

ma 2eme question:

peut on combiner ton script avec ceci

Code :

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

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<html> 
 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> 
<title>Nouvelle page 1</title> 
<style type="text/css"> 
.titlebar{font-size:11px; 
        font-family:verdana; 
        color:white; 
        font-weight:bold; 
        width:100%; 
        background-color:Darkslateblue; 
        padding:2px; 
        text-align:left; 
        } 
 
.msgbox{border:outset 2px white; 
       background-color:gainsboro; 
       width:300px; 
       height:180px; 
       color:black; 
       padding-left:1px; 
       padding-right:2px; 
       padding-top:1px; 
       font-family: verdana; 
       font-size:11px; 
       text-align:center 
          } 
.cross{border:outset 2px white; 
       background-color:gainsboro; 
       left:2px; 
       width:18px; 
       color:black; 
         font-family:tahoma; 
         float:right; 
         margin-top:0px; 
         padding-left:4px; 
         padding-bottom:2px; 
         padding-top:1px; 
         top:0px; 
         line-height:10px; 
         cursor:default; 
         } 
.bouton{width:80px; 
       height:25px; 
       border:oustet 2px silver; 
       position:relative; 
       font-size:11px; 
       font-family: tahoma; 
       } 
 
.innerText{width:100%; 
         padding-left:30px; 
         text-align:left; 
         }       
 
#testzone {position:absolute; 
           top:100px; 
           left:200px; 
           } 
</style> 
 
 
</head> 
 
<body> 
<input type="button" onclick="document.getElementById('testzone').style.display='block';" value="alert"/> 
<div id='testzone' class="msgbox" style="display:none;" > 
 <div class="titlebar"> 
  <div class="cross">X</div> Title 
 </div> 
 
<br/> 
<br/> 
<br/> 
<div class='innerText'> 
Pour poursuivre veuillez répondre à cette question: 
Avez vous une toute petite boite ? 
</div> 
<br/> 
<br/> 
<br/> 
<div> 
<input type="button" id="trap" value="OK" class="bouton" onclick="document.getElementById('testzone').style.display='none';" style="left:0px;"/> 
 
</div> 
 
</div> 
 
</body> 
 
</html>

en y incorporant le message sur les dimensions ! Ca serai trés beau je trouve

(supposition) enfin peut-etre qu'a partir du bouton OK on pourrai vider l'image pour rejoindre ma 1ere question?

**siddh** · 13/01/2006, 17h34

un truc comme ça ?

Code :

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

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
 
<html>
 
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
	<title>Nouvelle page 1</title>
	<style type="text/css">
	.titlebar{font-size:11px;
			font-family:verdana;
			color:white;
			font-weight:bold;
			width:100%;
			background-color:Darkslateblue;
			padding:2px;
			text-align:left;
			}
 
	.msgbox{border:outset 2px white;
		   background-color:gainsboro;
		   width:300px;
		   height:180px;
		   color:black;
		   padding-left:1px;
		   padding-right:2px;
		   padding-top:1px;
		   font-family: verdana;
		   font-size:11px;
		   text-align:center
			  }
	.cross{border:outset 2px white;
		   background-color:gainsboro;
		   left:2px;
		   width:18px;
		   color:black;
			 font-family:tahoma;
			 float:right;
			 margin-top:0px;
			 padding-left:4px;
			 padding-bottom:2px;
			 padding-top:1px;
			 top:0px;
			 line-height:10px;
			 cursor:default;
			 }
	.bouton{width:80px;
		   height:25px;
		   border:oustet 2px silver;
		   position:relative;
		   font-size:11px;
		   font-family: tahoma;
		   }
 
	.innerText{width:100%;
			 padding-left:30px;
			 text-align:left;
			 }       
 
	#testzone {position:absolute;
			   top:100px;
			   left:200px;
			   }
	</style>
 
 <script type='text/javascript'>
	var im,log;
 
	function verifIm(){
 
			if ((im.height>29 || im.width>26)){
				msg="La hauteur maximum du logo est de : 29 <br />et la hauteur de votre logo est de  : "+im.height
				msg+="<p>La largeur maximum du logo est de : 26 <br />et la largeur de votre logo est de : "+im.width
				msg+="</p><p>VEUILLEZ MODIFIER LES DIMENSIONS DE VOTRE LOGO</p>"
 
				val2 = document.createElement("input");
				val2.type = "file";
				val2.name= "logo";
				val2.id= "logo";
				val2.onchange = function(){
					verif();
				}
				log.parentNode.replaceChild(val2,log);
				log = val2;
				im.src = "";
				document.getElementById('testzonetext').innerHTML=msg;
				document.getElementById('testzone').style.display='block';
				}		
	}
 
	function verif(){
		cont = document.getElementById('container');
 
		im.onload = function(){setTimeout("verifIm()",500);}
 
		im2.src = log.value;
		im.src = log.value;
	}
	window.onload = function(){
		im = document.getElementById('monimg');
		im2 = document.getElementById('miniimg');
		log = document.getElementById('logo');
	}
    </script>
</head>
<body>
			<div id='errmess' style='color:red;font-weight:bold;font-size:bigger'></div>
            <input name="logo" type="file" id='logo' size="20" maxlength="40" onchange="verif()" onclick="im2.src=''">
          </div>
		  <div style="width:0px;height:0px;overflow:hidden"><img id="monimg" alt="test de votre logo" src="" name="tjs_img"/></div>
          <div id="container">
            <div align="center"><img id="miniimg" style="width:100px;" alt="test de votre logo" src="" name="min_img"/>
</div></div>
<div id='testzone' class="msgbox" style="display:none;" >
 <div class="titlebar">
  <div class="cross">X</div> Title
 </div>
 
<br/>
<br/>
<br/>
<div class='innerText' id='testzonetext'>
 
</div>
<br/>
<br/>
<br/>
<div>
<input type="button" id="trap" value="OK" class="bouton" onclick="im2.src='';document.getElementById('testzone').style.display='none';" style="left:0px;"/>
 
</div>
 
</div>
</body>
</html>

**NoobX** · 13/01/2006, 17h41

Merci ca m'a la'air parfait!

J'etais dans la bonne direction il me semble

je vais tester ton script a fond mais il m'a l'air du tonerre !

histoire de dire je post mon sript inachevé
là ou j'en étais quoi c'est sur qu'il est moins abouti que le tiens mais bon c'est hsitoire de dire

Code :

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

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<html> 
<head> 
 
<style type="text/css"> 
.titlebar{font-size:11px; 
        font-family:verdana; 
        color:white; 
        font-weight:bold; 
        width:100%; 
        background-color:Darkslateblue; 
        padding:2px; 
        text-align:left; 
        } 
 
.msgbox{border:outset 2px white; 
       background-color:gainsboro; 
       width:300px; 
       height:180px; 
       color:black; 
       padding-left:1px; 
       padding-right:2px; 
       padding-top:1px; 
       font-family: verdana; 
       font-size:11px; 
       text-align:center 
          } 
.cross{border:outset 2px white; 
       background-color:gainsboro; 
       left:2px; 
       width:18px; 
       color:black; 
         font-family:tahoma; 
         float:right; 
         margin-top:0px; 
         padding-left:4px; 
         padding-bottom:2px; 
         padding-top:1px; 
         top:0px; 
         line-height:10px; 
         cursor:default; 
         } 
.bouton{width:80px; 
       height:25px; 
       border:oustet 2px silver; 
       position:relative; 
       font-size:11px; 
       font-family: tahoma; 
       } 
 
.innerText{width:100%; 
         padding-left:30px; 
         text-align:left; 
         }       
 
#testzone {position:absolute; 
           top:100px; 
           left:200px; 
           } 
</style> 
 
 
 <script type='text/javascript'> 
   var im,log; 
 
   function verifIm(){ 
 
         if ((im.height>29 || im.width>26)){ 
            msg="La hauteur maximum du logo est de : 29 <br />et la hauteur de votre logo est de  : "+im.height 
            msg+="<p>La largeur maximum du logo est de : 26 <br />et la largeur de votre logo est de : "+im.width 
            msg+="</p><p>VEUILLEZ MODIFIER LES DIMENSIONS DE VOTRE LOGO</p>" 
			msg+="<input type='button' value='OK' onclick='document.getElementById('testzone').style.display='none''>" 
 
 
            val2 = document.createElement("input"); 
            val2.type = "file"; 
            val2.name= "logo"; 
            val2.id= "logo"; 
            val2.onchange = function(){ 
               verif(); 
            } 
            log.parentNode.replaceChild(val2,log); 
            log = val2; 
            im.src = ""; 
	  document.getElementById('testzone').style.display='block';
	   document.getElementById('testzone').innerHTML = msg;
 
            }       
   } 
 
   function verif(){ 
      document.getElementById('testzone').innerHTML = ''; 
      cont = document.getElementById('container'); 
 
      im.onload = function(){setTimeout("verifIm()",500);} 
 
      im2.src = log.value; 
      im.src = log.value; 
   } 
   window.onload = function(){ 
      im = document.getElementById('monimg'); 
      im2 = document.getElementById('miniimg'); 
      log = document.getElementById('logo'); 
   } 
    </script> 
</head> 
<body> 
         <div id='errmess' style='color:red;font-weight:bold;font-size:bigger'></div> 
            <input name="logo" type="file" id='logo' size="20" maxlength="40" onchange="verif()" onclick="im2.src=''"> 
          </div> 
        <div style="width:0px;height:0px;overflow:hidden"><img id="monimg" alt="test de votre logo" src="" name="tjs_img"/></div> 
          <div id="container"> 
            <div align="center"><img id="miniimg" style="width:100px;" alt="test de votre logo" src="" name="min_img"/> 
</div></div> 
 
<div id='testzone' class="msgbox" style="display:none;" > 
 <div class="titlebar"> 
  <div class="cross">X</div> Title 
 </div> 
 
<br/> 
<br/> 
<br/> 
<div class='innerText'> 
</div> 
<br/> 
<br/> 
<br/> 
<div> 
<input type="button" id="trap" value="OUI" class="bouton" onclick="document.getElementById('testzone').style.display='none';" style="left:0px;"/> 
 
<input type="button" id="trap" value="NON" class="bouton" style="left:5px;"/> 
</div> 
 
</div> 
 
</body> 
</html>

bon bah merci beaucoup @ siddh et spaceFrog et les autres

upload d'image et verification d la taille (hauteur/largeur) [Sources]

JavaScript

Discussions similaires

Partager

Partager