Bonjour,

Fonction du navigateur utilisé, (en particulier Firefox et Chrome) j'ai un problème de récupération de la hauteur et largeur de l'image préchargée. Pourtant j'effectue plusieurs tests : image complètement chargée et ou hauteur / largeur non nulle

Voici le code javascript qui me pose problème :

La fonction resize véhicule le nom de l'image, la hauteur écran, la largeur écran.

Si taille image inférieur à l'écran l'image reste en l'état. Sinon on la recadre en respectant le ratio image verticale ou horizontale maximum selon résolution écran.

Mon problème est la récupération de la taille de l'image qui va être affichée par la suite...

Je précharge donc cette image... J'ai ajouté un image.onload pour ne pas avoir une taille zéro uniquement sous Firefox et Chrome... qui retourne True systématiquement sur image.complete, donc je teste aussi la dimention de l'image...

Mon code passe outre ce test... Pourquoi ?

J'ai donc inséré un onload...

La boite d'alerte récupère à tout coup la hauteur et la largeur de l'image préchargée… les variables imgH et imgW qui suivent contiennent bien ces valeurs mais ensuite elles sont perdues une fois l'instruction image.src = url;… tant avec la valeur this.width que image.width.

Où se situe ma bourde ? Je patine dans la choucroute depuis une semaine...

Merci par avance !

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
<script type="text/javascript">
 
function IsImageOk(img) {
 
// Test si image non chargée
if (!img.complete) {
return false;
}
 
// Test si largeur zéro
if (typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) {
return false;
}
 
// Test si hauteur zéro
if (typeof img.naturalHeight != "undefined" && img.naturalHeight == 0) {
return false;
}
 
// Sinon tout est Ok
return true;
}
 
 
function myTimer()
{
// pour patienter
}
 
 
// Permet de limiter la taille de l'image à la résolution écran si besoin
function resize(url, mh, mw) {
 
// Précharger Image(url)
var image = new Image();
 
 
image.onload = function() {
// pour test si récup hauteur et largeur
alert(this.width + " x " + this.height);
 
// Déterminer la taille de l'image chargée
	imgH = this.height;
	imgW = this.width;
}
 
image.src = url;
 
// Test image non chargee on patiente
if (!IsImageOk(image)) {
myVar = setInterval(function(){myTimer()},1000);
}
 
// Déterminer la taille de l'image chargée
//	imgH = image.height;
//	imgW = image.width;
 
	if( imgH < mh && imgW < mw ) {
	// Image d'origine plus petite que la fenêtre, on initialise la taille de l'image
		imgH = imgH;
		imgW = imgW;
	} else {
		imgH = imgH;
		imgW = imgW;
		ratioH = mh / imgH;
		ratioW = mw / imgW;
		if ( ratioH < ratioW || imgH == imgW ) {
			imgH = Math.floor((imgH * ratioH));
			imgW = Math.floor((imgW * ratioH));
		} else {
			imgH = Math.floor((imgH * ratioW));
			imgW = Math.floor((imgW * ratioW));
		}
	}
}
 
</script>