Résolu HTML, probleme d'insertion d'image

Solutions (9)
Tags :
  • Intranet
  • Html
  • photo
  • Programmation
|
Bonjour à tous.

Je suis en train de construire un site intranet destiné à répertorier les oeuvres qu'une galerie expose.
Parmi les champs de la base de données se trouvent des liens vers des photos. Et j'ai un problème pour les afficher correctement. Je m'explique :

- Toutes les photos n'ont évidemment pas les mêmes dimensions (de 800x600 à 3000x2000) et je ne peux pas demander aux personnes qui entrent les images de les redimensionner.
- Elles ne sont pas orientées de la même manière (certaines panoramiques, d'autres en 4:3, ...)

Et je voudrais créer une page "iconographie" avec des sortes de vignettes qui seraient les fameuses images réduites.

Mais quand je fais par exemple :
  1. <img src="image.jpg width="150" height="100">"

ça ne convient qu'à des photos orientées horizontalement. Ou l'inverse. Donc pas à toutes les images.

Et si je fais :
  1. <img src="image.jpg width="50%" height="50%">

Je me retrouve avec des images qui n'ont pas toutes les mêmes dimensions (cf. plus haut).

Du coup j'ai essayé de les mettre dans des cellules de tableaux à dimensions définies mais évidemment les images "poussent" les bords des cellules.

J'ai essayé des frames mais c'est pas beaucoup mieux et en plus ça ne convient pas au style du site.

Je vous sollicite donc dans l'espoir que vous me proposiez une idée géniale qui me sauve de la crise de nerf !!!

Merci d'avance.
Contenus similaires
Meilleure solution
partage
, Ex-AdMiN |
Dans l'idéal, c'est à toi de les redimensionner coté serveur ... Sinon, il y a la solution de la balise <img> que tu as utiliser mais qui est très déconseillée. Ou sinon la technique tu background en CSS qui au lieu de rédure la taille tronque, à gauche, droite ou les 2.
  • Commenter cette solution |
Score
0
òh
òi
|
le mieux est de générer un vignette qui est une copie de la photo d'origine de petite taille
le lien dessus ouvre la photo originale
  • Commenter cette réponse |
Score
0
òh
òi
, Ex-AdMiN |
Il est clair que ce genre de traitement doit se faire de manière asynchrone et non au chargement de la page de manière systématique. En un mot plus générique : faire du cache.
  • Commenter cette réponse |
Score
0
òh
òi
|
Merci à tous pour vos suggestions.
Finalement j'ai opté pour un redimensionnement des images grâce à la librairie gd de php. Le problème c'est les ressources que prennent ce genre de choses du côté serveur. Comme c'est essentiellement en intranet que les utilisateurs vont entrer les données ça pourra aller mais bon c'est pas le top.
Je vais essayer ta proposition romualb mais la consultation des images se fera par contre en internet et le chargement d'une photo qui fait 8 mega c'est à oublier tout de suite !

Qu'en pensez-vous ? le redimensionnement est finalement le meilleur choix non ?

Merci encore
  • Commenter cette réponse |
Score
0
òh
òi
|
tu peux appliquer un style en indiquant seulement la largeur
<img src="image.jpg" width="100" /> ou
<img src="image.jpg" style="width:100px;" />
  • Commenter cette réponse |
Score
0
òh
òi
|
  1. <img src="image.jpg width="100" height="100" />


Que l'image soit panoramique ou 4:3 la largeur et la hauteur seront identiques. C'est juste au niveau visuel que ca risque de géner!

C'étais juste une suggestion, pas la peine de m'agresser :( 
  • Commenter cette réponse |
Score
0
òh
òi
, Ex-AdMiN |
Tu en réponds absolument pas à son problème avec ce genre de réponse ... ETtcomment ?
  • Commenter cette réponse |
Score
0
òh
òi
|
Ou faire des images carrés...
  • Commenter cette réponse |
Score
0
òh
òi
|
up ...

help plz je galère
  • Commenter cette réponse |

Ce n'est pas ce que vous cherchiez ?

Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS