Image non retrouvée sous Internet Explorer

**BeatGrinder** · 27/05/2009, 11h49

Bonjour,

je suis chargé d'afficher plusieurs images provenant d'une base de données, donc rapatriées dynamiquement (en fonction d'une recherche).
Voulant afficher des vignettes, je les redimensionne avec javascript. Je leur donne donc un identifiant, qui est leur id dans la base.

Code :

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

echo "<img src=\"".IMAGE_HOST."/Vignettes/".$photo["id_photo"].".jpg\" id=\"".$photo["id_photo"]."\" />";

Ensuite, dans ma fonction javascript :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
function vignette(idV) {
    var echelle = 80;
    var largeur = document.getElementById(idV).width;
    var hauteur = document.getElementById(idV).height;
    var rapport = (largeur > hauteur) ? echelle/largeur : echelle/hauteur;
    if(largeur > hauteur) {
        document.getElementById(idV).width = echelle;
        document.getElementById(idV).height = hauteur*rapport;
    } else {
        document.getElementById(idV).height = echelle;
        document.getElementById(idV).width = largeur*rapport;
    }
}

Ce code marche correctement sous Firefox, mais sous Internet Explorer, il n'affiche rien ! J'ai essayé d'afficher les dimension initiales de l'image sous IE, et il affiche "0" et "0"...Autant dire que je suis particulièrement déboussolé, surtout que j'ai une autre page de manipulation d'image qui fonctionne très bien sous IE avec un id...

En bref, je suis dans le jus, ça m'a l'air tout bête, mais je ne sais pas du tout comment arranger ça...je n'ai rien trouvé en effectuant des recherches sur internet ou sur le forum...

Merci !

**E.Bzz** · 27/05/2009, 12h19

Bonjour,
et en ajoutant l'unité ?

Code :

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

1
2
document.getElementById(idV).width = echelle + 'px';
document.getElementById(idV).height = (hauteur*rapport) + 'px';

A+

**BeatGrinder** · 27/05/2009, 14h12

Désolé, quand je rajoute les unités des dimensions, ça ne fonctionne plus, ni sur Firefox, ni sur IE (c'est-à-dire : rien ne s'affiche).

Merci quand même, je n'y avais pas pensé...

EDIT :

Je viens de trouver une solution qui fonctionne sur les deux navigateurs :

dans mon cas, puisque je souhaite redimensionner l'image en fonction de sa hauteur ou de sa largeur (suivant la forme de cette image), je fixe la hauteur (resp. la largeur) à une valeur fixée (var echelle), puis la largeur (resp. la hauteur) en fonction d'un rapport de dimensions.

La solution consiste à seulement fixer la hauteur (resp. la largeur) à la valeur fixée echelle. Le reste s'ajuste automatiquement :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
function vignette(idV) {
	var echelle = 80;
	var largeur = document.getElementById(idV).width;
	var hauteur = document.getElementById(idV).height;
	//var rapport = (largeur > hauteur) ? echelle/largeur : echelle/hauteur;
	if(largeur > hauteur) {
		document.getElementById(idV).width = echelle;
		//document.getElementById(idV).height = hauteur*rapport + 'px';
	} else {
		document.getElementById(idV).height = echelle;
		//document.getElementById(idV).width = largeur*rapport + 'px';
	}
}

Malheureusement, certains affichages d'images ne se font pas correctement (à peu de choses près), c'est-à-dire que les dimensions d'arrivée ne sont pas exactement proportionnelles à celles de départ...Je me satisferai de ça pour le moment, mais je suis curieux de comprendre ce phénomène. Si quelqu'un a une explication, je suis intéressé !

Merci.

**E.Bzz** · 27/05/2009, 14h15

Arf !
.style.width
.style.height

A+

**BeatGrinder** · 27/05/2009, 14h22

Avec style.width et style.height, j'obtiens le même résultat que la solution que j'ai citée avant, sur Internet Explorer. Sur Firefox, les images ne sont pas redimensionnées...merci tout de même !

A plus