Le problème dans ce code (est dans celui de l'autre post), c'est que la fonction qui récupère la taille de l'image ce fait au début du chargement de l'image, et non pas à la fin de celle-ci.
Si cela marche de temps en temps, c'est parce que le navigateur charge l'image plus vite qu'il execute le script (car il récupère l'image dans le cache). Mais parfois, il met un peu plus de temps, ce qui explique le 0*0 (par contre, je comprend pas pourquoi il y a parfois 32*28).

Personnellement, je n'aime pas cette méthode "expression" propre a IE. Le mieux est d'utiliser le javascript.
Pour reprendre ton précédent post, il faut attendre que l'image soit bien charger. Soit en mettant un évenement dessus :

img.onload = function(){
  /* code */
}

while(!img.complete){
  /* On ne fait rien */
}

Bonjour GallyNet,

Chez moi, la méthode while boucle indéfiniment comme tu l'avais prédit.

Je ne comprend pas comment utiliser img.onload (dans la fonction JS, dans le corps de la page,.....).
Si tu pouvais m'éclairer un peu là.

Merci de ton aide !!

Pour le onload, on passe une fonction qui sera exécutée à la fin du chargement de l'image. Si tu veut tester si le chargement marche bien, tu peut commencer par mettre un simple alert :

var img = new Image();
img.onload = function(){
  alert('Image chargé');
}
img.src = 'monImage.jpg';

Je pense avoir bien fait ce que tu m'a dits. Mais bien que le message d'alerte me dise bien que l'image est chargée, celle-ci n'est pas toujours ouverte.

function redimImage(inImg, inMW, inMH)
		{	
		  // Cette function recoit 3 parametres
		  // inImg : Chemin relatif de l'image
		  // inMW  : Largeur maximale
		  // inMH  : Hauteur maximale
		  var maxWidth = inMW;
		  var maxHeight = inMH;
		  // Declarations des variables "Nouvelle Taille"
		  var dW = 0;
		  var dH = 0;
		  // Declaration d'un objet Image
		  var oImg = new Image();
		  // Affectation du chemin de l'image a l'objet
		  
			oImg.onload = function()
			{
			  alert('Image chargé');
			}

		  oImg.src = inImg;
		  // On recupere les tailles reelles
		  var h = dH = oImg.height;
		  var w = dW = oImg.width;
		  // Si la largeur ou la hauteur depasse la taille maximale
		  if ((h >= maxHeight) || (w >= maxWidth)) {
			// Si la largeur et la hauteur depasse la taille maximale
			if ((h >= maxHeight) && (w >= maxWidth)) {
			  // On cherche la plus grande valeur
			  if (h > w) {
				dH = maxHeight;
				// On recalcule la taille proportionnellement
				dW = parseInt((w * dH) / h, 10);
			  } else {
				dW = maxWidth;
				// On recalcule la taille proportionnellement
				dH = parseInt((h * dW) / w, 10);
			  }
			} else if ((h > maxHeight) && (w < maxWidth)) {
			  // Si la hauteur depasse la taille maximale
			  dH = maxHeight;
				// On recalcule la taille proportionnellement
			  dW = parseInt((w * dH) / h, 10);
			} else if ((h < maxHeight) && (w > maxWidth)) {
			  // Si la largeur depasse la taille maximale
			  dW = maxWidth;
				// On recalcule la taille proportionnellement
			  dH = parseInt((h * dW) / w, 10);
			}
		  }
		  // On ecrit l'image dans le document
		  document.writeln("<img src=\"" + inImg + "\" width=\"" + dW*2 + "\" height=\"" + dH*2 + "\" border=\"0\" class=\"cadre_photo\" >");
		  };

Je pense que l'affichage de ton image ne marche pas, car le traitement que tu fait, n'est pas mis dans la fonction onload.
C'est un peu compliqué a expliquer, mais la fonction onload est asynchrone. Elle est exécuter quand le chargement de l'image sera terminé, mais le reste du script continuera de s'exécuter même si l'image n'est pas chargé.

J'ai pas trops le temps actuellement, mais si j'y pense se soir, je te fait un exemple complet a partir de ta fonction.

Salut,

Désolé de répondre si tard mais j'étais en déplacement.

J'ai imbriqué tout ça et ça marche impec. Merci beaucoup pour tes explications qui sont très bien faites.
Car le plus important, ce n'est pas que ça marche mais c'est de comprendre, et là c'est le cas.

Un très grand merci GallyNet !!!!!!

ps : juste une remarque, lorsqu'on appel la fonction

redim('monImage.jpg', 100, 100, 'monConteneur');

var conteneur = document.getElementById('monConteneur');

En fait, pour prendre correctement en compte le passage de l'identifiant du conteneur, il faut faire quelque modification.

function redimImage(inImg, inMW, inMH){

function redimImage(inImg, inMW, inMH, conteneur){

oImg.maxWidth = inMW;
oImg.maxHeight = inMH;

oImg.conteneur = conteneur;

var conteneur = document.getElementById('monConteneur');

var conteneur = document.getElementById(oImog.conteneur);

Oki oki,

Tout est très clair maintenant.

Encore merci pour tout le temps que t'as passé à m'aider.

A bientôt !!

Rhhaaaaaaaaaaaaaaa !!!!!!!!!!!!!!!!

J'en rage !!!!!!! En fait, je pensais que ça marchait mais j'avais juste de la chance lors de mes tests. En fait j'en suis exactement au même point qu'au début là.

J'étais pourtant sur que ta méthode marcherait. Je ne sais vraiment plus quoi faire. En plus, tout les messages laissés à l'auteur de cette source Javascript par tous ceux ayant le même problème sont restés sans réponses.

Et dire que j'avais mis ce poste en "résolu" !!! snif snif

"En fait j'en suis exactement au même point qu'au début là. "
Sa fait a nouveau un redimensionnement aléatoire ? Est-ce que ça le fait quand tu charge une seule image, ou plusieurs ?

C'est quand même bizarre que ça marche pas, la taille que l'on récupère devrait être bonne.

En fait, la photo s'affiche correctement ou ne s'affiche pas du tout.

Je ne charge qu'une seule image dans mon exemple.
Cependant, l'appel de fonction est présent deux fois dans ma page mais dans des "if" différents.

Encore un copier/coller de mon code :

Fonction entre <head> et </head> :

function redimImage(inImg, inMW, inMH, conteneur){
  // Cette function recoit 3 parametres
  // inImg : Chemin relatif de l'image
  // inMW  : Largeur maximale
  // inMH  : Hauteur maximale
  var maxWidth = inMW;
  var maxHeight = inMH;
  // Declarations des variables "Nouvelle Taille"
  var dW = 0;
  var dH = 0;
  // Declaration d'un objet Image
  var oImg = new Image();
  // Enregistrement des varaibles sur l'image
  oImg.maxWidth = inMW;
  oImg.maxHeight = inMH;
  oImg.conteneur = conteneur;
  
  oImg.onload = function(){
    /* Quand on est dans une fonction évenement, du style onload, "this"
    * correspond à l'objet qui possede la fonction. Dans notre cas, c'est l'image.
    * De même, on est pas sûr de retrouver les variables de la fonction de départ.
    *C'est pour cela que j'ai enregistré les tailles max dans l'objet l'image. */
    
    // On recupere les tailles reelles
    var h = dH = this.height;
    var w = dW = this.width;
    // Si la largeur ou la hauteur depasse la taille maximale
    if ((h >= this.maxHeight) || (w >= this.maxWidth)) {
      // Si la largeur et la hauteur depasse la taille maximale
      if ((h >= this.maxHeight) && (w >= this.maxWidth)){
        // On cherche la plus grande valeur
        if (h > w) {
        dH = this.maxHeight;
        // On recalcule la taille proportionnellement
        dW = parseInt((w * dH) / h, 10);
        } else {
        dW = this.maxWidth;
        // On recalcule la taille proportionnellement
        dH = parseInt((h * dW) / w, 10);
        }
      } else if ((h > this.maxHeight) && (w < this.maxWidth)) {
        // Si la hauteur depasse la taille maximale
        dH = this.maxHeight;
        // On recalcule la taille proportionnellement
        dW = parseInt((w * dH) / h, 10);
      } else if ((h < this.maxHeight) && (w > this.maxWidth)) {
        // Si la largeur depasse la taille maximale
        dW =this.maxWidth;
        // On recalcule la taille proportionnellement
        dH = parseInt((h * dW) / w, 10);
      }
      
      // On ecrit l'image dans le document
      // Récupération de l'objet conteneur
		var conteneur = document.getElementById(oImg.conteneur);
		// On test si l'objet a bien été récupéré
		if(conteneur)
		{
		  // On met la taille à l'objet Image
		  oImg.width = dW*2;
		  oImg.height = dH*2;
		  // On ajout l'image à la fin du conteneur
		  conteneur.appendChild(oImg);
		}
    }
  }
  // Affectation du chemin de l'image a l'objet
  oImg.src = inImg;
};

<div id="monConteneur" class="cadre_photo">
    <script type="text/javascript">
    <!--
        redimImage('photos_etablissements/etablissement_<%=id%>.jpg', 110, 90, 'monConteneur');
    //-->
    </script>
</div>

Je pousse un grand OUUUUUUF !!!!!

Mon erreur était dans ma feuille de style. En effet le <div id="monConteneur" class="cadre_photo"> était lui même dans un <span> dont la largeur était définie comme fixe et était inférieur à la largeur maxi de l'image à afficher.

En espérant que ce fût bien ça. En tout cas, cette fois, j'ai testé la page une bonne centaine de fois pour être sûr :)

Mais le problème était bien la fonction javascript qui était mal obtimisée, donc ton aide ne m'aura pas été inutile. En fait j'avais deux erreurs (un dans le css et un dans le JS).

Je peux maintenant remettre le poste en "résolu" (enfin j'espère lol)

Chussss !

Et dire que j'étais en train de me prendre la tête pour trouver d'où venait le problème...

Heureusement que ça vient du CSS et pas de ma fonction : mon ego allez en prendre un coup sinon pp

Héhéhé, vraiment désolé GallyNet. J'espère qu'un jour je pourrais me prendre la tête pour toi à charge de revanche.
Même si j'ai quelques doutes lol.

En tout cas je le répète, merci encore pour le temps que tu a passé à m'aider.

A+++

Pour ma part, cela ne marche pas.

- Soit cela m'affiche l'image seul dans la page.

- Soit pas au bonne endroit.

Je n'ai pas utilisé de conteneur, car si j'utilise un conteneur je peux pas afficher plusieurs images.

Donc il n'y a aucun moyen fiable ?

Holà, ça fait longtemps cette discutions.

Pour ce qui est d'avoir un moyen fiable : il faut bien savoir que l'on est en JavaScript, on est donc loin d'être sûr de ce qu'un script va faire.

Par contre, il est bien possible d'afficher plusieurs images dans le même conteneur. La fonction fait un appendChild, ce qui ajoute l'image courante à la suite des autres images.

Justement , j'ai une sorte de blog, donc c'est pour chaque post, donc il me faut un conteneur différent ...

mais j'ai trouvé une solution en css , max-width:600px allier à width : expression(Math.min(this.width, 600));
ca marche très bien, des fois il vaut mieux faire un truc simple que chercher le compliqué

Effectivement, si avec juste un peu de CSS tu obtient ce que tu veut, y'a pas besoin d'aller chercher plus loin.