jQuery Girl
  1. jQuery Girl
  3. Conserver les proportions avec la largeur de l’image en css
Intereting Posts
Étendre un object JavaScript en passant une chaîne avec le chemin d’access et une valeur Comment lire des nœuds parents avec des nœuds enfants partiellement sélectionnés Jquery Mobile Listview Item Clicked – Passage du paramètre à une autre page Fractionnement du texte dans textarea par les nouvelles lignes (y compris les lignes vides) dans un tableau javascript L’ajout de div entraîne l’élément à défiler vers le bas jquery append / supprimer une classe de .parent () Envoi de plusieurs éléments au contrôleur MVC via jQuery.Ajax Sauvegarder toutes les propriétés css de l’élément en utilisant jquery Rester sur l’onglet jQuery actuel après publication? Supprimer les balises vides dans un document HTML avec jQuery Barre de progression Bootstrap Prendre les pages vues des urls Générer du contenu pseudo-CSS pour avant / après de manière dynamic en utilisant Angularjs Les méthodes val () et prop () de jQuery utilisent-elles des valeurs html-escape? point d’échappement en javascript

Conserver les proportions avec la largeur de l’image en css

Existe-t-il un moyen de corriger le format des images avec une largeur plus petite à l’aide de CSS? Peut-être en utilisant jQuery / javascript?

Merci!

Avec CSS simple, vous ne pouvez définir qu’une seule dimension des images, soit la width ou la height et définir l’autre comme étant auto , par exemple: 

 .thumb { width:200px; height:auto; }

Les images auront une largeur fixe de 200 pixels et la hauteur dépendra du rapport de format.

Voici la solution jQuery;) 

 function fixImage(elm) { elm = $(elm); var x = elm[0]; var allowedHeight = 80; var allowedWidth = 80; if (width > height) { elm.css('width', allowedWidth + 'px'); elm.css('height', 'auto'); } else { elm.css('height', allowedHeight + 'px'); elm.css('width', 'auto'); } }