Discussion :

[Neii Mad]

Bonjour,

Je me doute que le sujet peut être redondant, mais malgré 3heures de recherches, je ne trouve pas de réponse à ma question.

Le problème étant que j'affiche une image, puis je la change via src, et que la seconde n'ayant pas les mêmes dimensions que la première se redimensionne à la taille de celle qui avait été affichée auparavant.

Ma question étant alors : est-il possible de récupérer avec javascript les dimensions réelles de l'image, non celles telles qu'affichées dans la page, ou dois je les récupérer en php ?


Merci aux répondeurs

[SpaceFrog]

offsetHeight et offsetWidth ou getComputedStyle()
mais cela suppose que l'image soit chargée coté client ...

[Neii Mad]

Ca me donne les dimensions de l'image telle qu'affichée, non celles de l'image réelle.

Peut être que je n'ai pas bien exprimé mon problème ?

j'ai une image affichée, à laquelle j'applique un changement de source.

Code :

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

1
2
3
4
5
6
 
<img src="1.jpx" id="pix" />
 
 
  document.pix.src = "pixies/(" + pix + ").jpg";
  alert(document.pix1.offsetHeight);

La deuxieme image se charge dans les mêmes dimensions que la première image, alors qu'elle est plus grande.

OffsetHeight me renvoie la taille de l'image telle qu'affichée, non les dimensions réelle.

[le_chomeur]

as tu définis une hauteur / largeur sur la première image ? si oui il est normal que la seconde image ne se redimensionne pas ...
par contre , si tu ne spécifie aucune dimensions, elle se redimensionnera automatiquement

[Neii Mad]

Ah, j'ai bien mis une hauteur, en pourcentage. (c'est pour afficher 5 images dans la page, j'utilise des % pour qu'elles prennent la même largeur et ne dépassent ainsi pas la page, donc je suis malheureusement obligé de les laisser)

[SpaceFrog]

si tu mets l'image en hidden sans preciser de taille tu pourras en recupérer les dimensions comme sus dit

[Neii Mad]

Ah oui, jolie astuce, je vais faire des tests et je tiens le sujet à jour.