Autosize d'une image - taille image par rapport taille fenetre

Bonjour à tous et à toutes…

j’aimerais afficher une image qui s’adapte à la taille de la fenêtre du navigateur.
C’est à dire que mon image de 600x600px fasse au maximum 600px et 80% de large. C’est à dire :

  • si la fenêtre fait 1000px de large alors l’image fera 600px
  • si la fenêtre fait 500px de large alors l’image fera 400 (80% de 500px).

C’est possible de faire ça dans une page html / css ?
Merci d’avance pour votre aide

@+ :bounce:

Saluton,
si tu identifies ton image en html comme ceci:
<img ig=‘resizable’ src=‘urlkivabien’> je te fais grâce de title
et que dans ta feuille de style tu fais qqe chose comme :
#resizable {height:80%;width:80%}
ça va la déformer et si l’image est toute petite, ça va être l’horreur

bah justement… je ne veux pas déformer l’image :paf:

Je voudrais avoir ce genre de truc

W = largeurFenetre;
if (W >=620) {
     largeurImage = 600;
     hauteurImage = 600;
} else {
     largeurImage = 0.8 * W;
     hauteurImage = 0.8 * W;
}

C’est peut-être plus clair… :stuck_out_tongue:

@+

Oh mais c’était clair, mais je ne sache pas que CSS permette de faire du dimensionnement conditionnel.
Le pourcentage est toujours par rapport à la taille du contenant

donc faudrait faire mumuse avec javascript ?

ou php ou asp ou machin.net ou perl ou python ou java ou…

C’est peut-être faisable avec CSS, mais je ne vois aps comment

faudra le faire en javascript alors :slight_smile:

Eventuellement tu as min-width/max-width, mais c’est CSS2.1 (donc exit IE)

ok ok :jap:

et donc vous auriez un p’tit lien pour ce genre de truc ? ou mieux peut-être vous sauriez le faire… :ange:

@+ :bounce: