{"id":26582,"date":"2017-04-24T12:16:59","date_gmt":"2017-04-24T12:16:59","guid":{"rendered":"https:\/\/dev.railscarma.com\/jquery-image-resizing-plugin-imgliquid\/"},"modified":"2021-06-05T09:12:36","modified_gmt":"2021-06-05T09:12:36","slug":"jquery-image-resizing-plugin-imgliquid","status":"publish","type":"post","link":"https:\/\/www.railscarma.com\/fr\/blog\/articles-techniques\/jquery-image-resizing-plugin-imgliquid\/","title":{"rendered":"Plugin jQuery de redimensionnement d'image : ImgLiquid"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"26582\" class=\"elementor elementor-26582\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-4e259f45 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"4e259f45\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-786eedd6\" data-id=\"786eedd6\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5ab37a77 elementor-widget elementor-widget-text-editor\" data-id=\"5ab37a77\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\tImgLiquid est un plugin jQuery qui permet de redimensionner les images afin qu'elles puissent tenir dans le conteneur.\n<h3>Caract\u00e9ristiques<\/h3>\n<ul style=\"font-family: \" montserrat\",sans-serif;\"=\"\">\n \t<li>Responsive en option (les param\u00e8tres par d\u00e9faut sont \"off\").<\/li>\n \t<li>L\u00e9ger : moins de 2KBs gzipp\u00e9s<\/li>\n \t<li>Remplissage\/Culture<\/li>\n \t<li>Aligner<\/li>\n \t<li>Rappels<\/li>\n \t<li>Support Svg<\/li>\n \t<li>FadeIn Anim optionnel (par d\u00e9faut, il est d\u00e9sactiv\u00e9)<\/li>\n \t<li>Compatible avec tous les navigateurs (y compris ie6)<\/li>\n<\/ul>\n<h3>Pourquoi l'utiliser ?<\/h3>\n<p align=\"justify\">C'est un tr\u00e8s bon plugin qui nous permet de maintenir une qualit\u00e9 \u00e9lev\u00e9e de l'image, en particulier au moment de la redimensionner. Vous avez d\u00fb constater que souvent, lorsque nous t\u00e9l\u00e9chargeons une image de n'importe quelle forme, qu'elle soit verticale ou horizontale, sa qualit\u00e9 se d\u00e9grade de mani\u00e8re significative. Ce plugin est donc tr\u00e8s utile pour maintenir la qualit\u00e9 de l'image au moment de la redimensionner.<\/p>\n\n<h3>Comment cela fonctionne-t-il ?<\/h3>\nIl permet d'adapter l'image ou de la redimensionner dans un conteneur. Il peut \u00e9galement \u00eatre personnalis\u00e9. La fa\u00e7on la plus simple de l'utiliser est d'inclure le fichier JavaScript et de l'appeler.\nPar exemple,\n<pre><code><script src=\"js\/imgLiquid-min.js\"><\/script> \/\/  including the javascript file<\/code><\/pre>\n<div class=\"imgLiquidFill imgLiquid\" style=\"width: 300px; height: 200px;\">\/\/ assignation d'une image <img decoding=\"async\" src=\"user.jpg\" alt=\"Personne\"><\/div>\n<pre><code>\n$(document).ready(function() { $(\".imgLiquidFill\").imgLiquid() ; \/\/ appel de l'image liquide\n}) ;<\/code><\/pre>\n<p align=\"justify\">Il masquera l'image attribu\u00e9e, c'est-\u00e0-dire <strong>(<img decoding=\"async\" src=\"user.jpg\" alt=\"Personne\">)<\/strong> et adaptera l'image \u00e0 l'arri\u00e8re-plan de la div, en la redimensionnant.\nSi vous choisissez \"fill : true\" lors de l'appel de la fonction imageliquid, c'est-\u00e0-dire <strong>($(\".imgLiquidFill\").imgLiquid(fill : true))<\/strong>il adaptera l'image \u00e0 l'arri\u00e8re-plan de la div. De m\u00eame, si vous choisissez \"<strong>remplir : false<\/strong>\"Vous pouvez alors voir l'image de la mani\u00e8re originale, comme vous l'avez t\u00e9l\u00e9charg\u00e9e. Dans les deux cas, la qualit\u00e9 de l'image sera maintenue.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-49bd3c8a elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"49bd3c8a\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-7b0661a7\" data-id=\"7b0661a7\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-59346dbf elementor-widget elementor-widget-heading\" data-id=\"59346dbf\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Abonnez-vous pour les derni\u00e8res mises \u00e0 jour<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-28099456 elementor-widget elementor-widget-shortcode\" data-id=\"28099456\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\t\t\t\t\t<script type=\"text\/javascript\">\n\t\t\t\t\t\tvar gCaptchaSibWidget;\n                        var onloadSibCallbackInvisible = function () {\n\n                            var element = document.getElementsByClassName('sib-default-btn');\n                            var countInvisible = 0;\n                            var indexArray = [];\n                            jQuery('.sib-default-btn').each(function (index, el) {\n                                if ((jQuery(el).attr('id') == \"invisible\")) {\n                                    indexArray[countInvisible] = index;\n                                    countInvisible++\n                                }\n                            });\n\n                            jQuery('.invi-recaptcha').each(function (index, el) {\n                                grecaptcha.render(element[indexArray[index]], {\n                                    'sitekey': jQuery(el).attr('data-sitekey'),\n                                    'callback': sibVerifyCallback,\n                                });\n                            });\n                        };\n\t\t\t\t\t<\/script>\n\t\t\t\t\t                <script src=\"https:\/\/www.google.com\/recaptcha\/api.js?onload=onloadSibCallbackInvisible&render=explicit\" async defer><\/script>\n\t\t\t\t\n\t\t\t<form id=\"sib_signup_form_1\" method=\"post\" class=\"sib_signup_form\" action=\"\">\n\t\t\t\t<div class=\"sib_loader\" style=\"display:none;\"><img\n\t\t\t\t\t\t\tsrc=\"https:\/\/www.railscarma.com\/wp-includes\/images\/spinner.gif\" alt=\"chargeur\"><\/div>\n\t\t\t\t<input type=\"hidden\" name=\"sib_form_action\" value=\"subscribe_form_submit\">\n\t\t\t\t<input type=\"hidden\" name=\"sib_form_id\" value=\"1\">\n                <input type=\"hidden\" name=\"sib_form_alert_notice\" value=\"Please fill out this field\">\n                <input type=\"hidden\" name=\"sib_form_invalid_email_notice\" value=\"Your email address is invalid\">\n                <input type=\"hidden\" name=\"sib_security\" value=\"d7f7626ab9\">\n\t\t\t\t<div class=\"sib_signup_box_inside_1\">\n\t\t\t\t\t<div style=\"\/*display:none*\/\" class=\"sib_msg_disp\">\n\t\t\t\t\t<\/div>\n                                            <div id=\"sib_captcha_invisible\" class=\"invi-recaptcha\" data-sitekey=\"6LdikOAaAAAAAJ6SWrrKVQrtw7TQpQAEnv0HS0G3\"><\/div>\n                    \t\t\t\t\t<p class=\"sib-email-area\">\r\n    <label class=\"sib-email-area\"><\/label>\r\n    <input type=\"email\" class=\"sib-email-area\" name=\"email\" required=\"required\" placeholder=\"Adresse e-mail\">\r\n<\/p>\r\n<p class=\"sib-NAME-area\">\r\n    <label class=\"sib-NAME-area\"><\/label>\r\n    <input type=\"text\" class=\"sib-NAME-area\" name=\"NAME\" placeholder=\"Nom\">\r\n<\/p>\r\n<p>\r\n    <input type=\"submit\" id=\"invisible\" class=\"sib-default-btn\" value=\"S&#039;abonner\">\r\n<\/p>\t\t\t\t<\/div>\n\t\t\t<input type=\"hidden\" name=\"trp-form-language\" value=\"fr\"\/><\/form>\n\t\t\t<style>\n\t\t\t\tform#sib_signup_form_1 p.sib-alert-message {\n    padding: 6px 12px;\n    margin-bottom: 20px;\n    border: 1px solid transparent;\n    border-radius: 4px;\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n}\nform#sib_signup_form_1 p.sib-alert-message-error {\n    background-color: #f2dede;\n    border-color: #ebccd1;\n    color: #a94442;\n}\nform#sib_signup_form_1 p.sib-alert-message-success {\n    background-color: #dff0d8;\n    border-color: #d6e9c6;\n    color: #3c763d;\n}\nform#sib_signup_form_1 p.sib-alert-message-warning {\n    background-color: #fcf8e3;\n    border-color: #faebcc;\n    color: #8a6d3b;\n}\n\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t  <div class=\"related-post slider\">\r\n        <div class=\"headline\">Articles Similaires<\/div>\r\n    <div class=\"post-list owl-carousel\">\r\n\r\n            <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Gemme de Kaminari\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/articles-techniques\/joyau-kaminari\/?related_post_from=37277\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"joyau kaminari\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2023\/04\/kaminari-gem-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Gemme de Kaminari\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/articles-techniques\/joyau-kaminari\/?related_post_from=37277\">\r\n        Gemme de Kaminari  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Pourquoi engager des d\u00e9veloppeurs Ruby on Rails en 2026 ?\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ror\/pourquoi-embaucher-des-developpeurs-ruby-on-rails\/?related_post_from=30627\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"pourquoi embaucher des d\u00e9veloppeurs Ruby on Rails en 2022\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2019\/01\/why-to-hire-ruby-on-rails-developers-in-2022-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Pourquoi engager des d\u00e9veloppeurs Ruby on Rails en 2026 ?\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ror\/pourquoi-embaucher-des-developpeurs-ruby-on-rails\/?related_post_from=30627\">\r\n        Pourquoi engager des d\u00e9veloppeurs Ruby on Rails en 2026 ?  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Importance de l&#039;architecture logicielle dans le d\u00e9veloppement de logiciels d&#039;entreprise\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ror\/importance-de-larchitecture-logicielle-dans-le-developpement-de-logiciels-dentreprise\/?related_post_from=36250\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"Importance de l&#039;architecture logicielle dans le d\u00e9veloppement de logiciels d&#039;entreprise\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/06\/Importance-of-Software-Architecture-in-enterprise-software-development-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Importance de l&#039;architecture logicielle dans le d\u00e9veloppement de logiciels d&#039;entreprise\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ror\/importance-de-larchitecture-logicielle-dans-le-developpement-de-logiciels-dentreprise\/?related_post_from=36250\">\r\n        Importance de l&#039;architecture logicielle dans le d\u00e9veloppement de logiciels d&#039;entreprise  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Ruby IDE\u00a0: les meilleurs IDE pour le d\u00e9veloppement Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ror\/ruby-ide-les-meilleures-idees-pour-le-developpement-de-ruby-on-rails\/?related_post_from=36125\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT.jpg\" class=\"attachment-full size-full wp-post-image\" alt=\"MEILLEURES ID\u00c9ES POUR LE D\u00c9VELOPPEMENT DE RUBY ON RAILS\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT.jpg 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT-300x113.jpg 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2022\/01\/BEST-IDES-FOR-RUBY-ON-RAILS-DEVELOPMENT-768x288.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Ruby IDE\u00a0: les meilleurs IDE pour le d\u00e9veloppement Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ror\/ruby-ide-les-meilleures-idees-pour-le-developpement-de-ruby-on-rails\/?related_post_from=36125\">\r\n        Ruby IDE\u00a0: les meilleurs IDE pour le d\u00e9veloppement Ruby on Rails  <\/a>\r\n\r\n        <\/div>\r\n      \r\n  <\/div>\r\n\r\n  <script>\r\n      <\/script>\r\n  <style>\r\n    .related-post {}\r\n\r\n    .related-post .post-list {\r\n      text-align: left;\r\n          }\r\n\r\n    .related-post .post-list .item {\r\n      margin: 10px;\r\n      padding: 10px;\r\n          }\r\n\r\n    .related-post .headline {\r\n      font-size: 14px !important;\r\n      color: #999999 !important;\r\n          }\r\n\r\n    .related-post .post-list .item .post_thumb {\r\n      max-height: 220px;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n          }\r\n\r\n    .related-post .post-list .item .post_title {\r\n      font-size: 14px;\r\n      color: #000000;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n      text-decoration: none;\r\n          }\r\n\r\n    .related-post .post-list .item .post_excerpt {\r\n      font-size: 12px;\r\n      color: #3f3f3f;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n      text-decoration: none;\r\n          }\r\n\r\n    .related-post .owl-dots .owl-dot {\r\n          }\r\n\r\n      <\/style>\r\n      <script>\r\n      jQuery(document).ready(function($) {\r\n        $(\".related-post .post-list\").owlCarousel({\r\n          items: 2,\r\n          responsiveClass: true,\r\n          responsive: {\r\n            0: {\r\n              items: 1,\r\n            },\r\n            768: {\r\n              items: 2,\r\n            },\r\n            1200: {\r\n              items: 2,\r\n            }\r\n          },\r\n                      rewind: true,\r\n                                loop: true,\r\n                                center: false,\r\n                                autoplay: true,\r\n            autoplayHoverPause: true,\r\n                                nav: true,\r\n            navSpeed: 1000,\r\n            navText: ['<i class=\"fas fa-chevron-left\"><\/i>', '<i class=\"fas fa-chevron-right\"><\/i>'],\r\n                                dots: false,\r\n            dotsSpeed: 1200,\r\n                                                    rtl: false,\r\n          \r\n        });\r\n      });\r\n    <\/script>\r\n  <\/div>","protected":false},"excerpt":{"rendered":"<p>ImgLiquid est un plugin jQuery permettant de redimensionner les images afin qu'elles puissent tenir dans le conteneur. Fonctionnalit\u00e9s Facultatif Responsive (les param\u00e8tres par d\u00e9faut sont \"off\"). L\u00e9ger : moins de 2KBs gzipp\u00e9s Fill\/Crop Align CallBacks Support Svg Optional FadeIn Anim (default settings are 'off') Compatible avec tous les navigateurs (Incl. ie6) Pourquoi l'utiliser ? C'est un tr\u00e8s bon ...<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ruby-regex-match-guide-with-examples\/\"> <span class=\"screen-reader-text\">Guide de correspondance des expressions rationnelles en Ruby (2026) avec exemples<\/span> Lire la suite \u00bb<\/a><\/p>","protected":false},"author":1,"featured_media":31779,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[384],"tags":[],"class_list":["post-26582","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technical-articles"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>jQuery Image Resizing Plugin: ImgLiquid - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development<\/title>\n<meta name=\"description\" content=\"ImgLiquid is a jQuery plugin for resizing the images so that these images can fit in the container. Features Optional Responsive (default settings are\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/articles-techniques\/jquery-image-resizing-plugin-imgliquid\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"jQuery Image Resizing Plugin: ImgLiquid - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\" \/>\n<meta property=\"og:description\" content=\"ImgLiquid is a jQuery plugin for resizing the images so that these images can fit in the container. Features Optional Responsive (default settings are\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.railscarma.com\/fr\/blog\/articles-techniques\/jquery-image-resizing-plugin-imgliquid\/\" \/>\n<meta property=\"og:site_name\" content=\"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/RailsCarma\/\" \/>\n<meta property=\"article:published_time\" content=\"2017-04-24T12:16:59+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-06-05T09:12:36+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"800\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@railscarma\" \/>\n<meta name=\"twitter:site\" content=\"@railscarma\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21\"},\"headline\":\"jQuery Image Resizing Plugin: ImgLiquid\",\"datePublished\":\"2017-04-24T12:16:59+00:00\",\"dateModified\":\"2021-06-05T09:12:36+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/\"},\"wordCount\":253,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.railscarma.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg\",\"articleSection\":[\"Technical Articles\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/\",\"url\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/\",\"name\":\"jQuery Image Resizing Plugin: ImgLiquid - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\",\"isPartOf\":{\"@id\":\"https:\/\/www.railscarma.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg\",\"datePublished\":\"2017-04-24T12:16:59+00:00\",\"dateModified\":\"2021-06-05T09:12:36+00:00\",\"description\":\"ImgLiquid is a jQuery plugin for resizing the images so that these images can fit in the container. Features Optional Responsive (default settings are\",\"breadcrumb\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage\",\"url\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg\",\"contentUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg\",\"width\":800,\"height\":300},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.railscarma.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"jQuery Image Resizing Plugin: ImgLiquid\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.railscarma.com\/#website\",\"url\":\"https:\/\/www.railscarma.com\/\",\"name\":\"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\",\"description\":\"RailsCarma is a Ruby on Rails Development Company in Bangalore. We specialize in Offshore Ruby on Rails Development based out in USA and India. Hire experienced Ruby on Rails developers for the ultimate Web Experience.\",\"publisher\":{\"@id\":\"https:\/\/www.railscarma.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.railscarma.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.railscarma.com\/#organization\",\"name\":\"RailsCarma\",\"url\":\"https:\/\/www.railscarma.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png\",\"contentUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png\",\"width\":200,\"height\":46,\"caption\":\"RailsCarma\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/RailsCarma\/\",\"https:\/\/x.com\/railscarma\",\"https:\/\/www.linkedin.com\/company\/railscarma\/\",\"https:\/\/myspace.com\/railscarma\",\"https:\/\/in.pinterest.com\/railscarma\/\",\"https:\/\/www.youtube.com\/channel\/UCx3Wil-aAnDARuatTEyMdpg\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"sameAs\":[\"https:\/\/www.railscarma.com\/hire-ruby-on-rails-developer\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"jQuery Image Resizing Plugin: ImgLiquid - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development","description":"ImgLiquid is a jQuery plugin for resizing the images so that these images can fit in the container. Features Optional Responsive (default settings are","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.railscarma.com\/fr\/blog\/articles-techniques\/jquery-image-resizing-plugin-imgliquid\/","og_locale":"fr_FR","og_type":"article","og_title":"jQuery Image Resizing Plugin: ImgLiquid - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development","og_description":"ImgLiquid is a jQuery plugin for resizing the images so that these images can fit in the container. Features Optional Responsive (default settings are","og_url":"https:\/\/www.railscarma.com\/fr\/blog\/articles-techniques\/jquery-image-resizing-plugin-imgliquid\/","og_site_name":"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development","article_publisher":"https:\/\/www.facebook.com\/RailsCarma\/","article_published_time":"2017-04-24T12:16:59+00:00","article_modified_time":"2021-06-05T09:12:36+00:00","og_image":[{"width":800,"height":300,"url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg","type":"image\/jpeg"}],"author":"admin","twitter_card":"summary_large_image","twitter_creator":"@railscarma","twitter_site":"@railscarma","twitter_misc":{"\u00c9crit par":"admin","Dur\u00e9e de lecture estim\u00e9e":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#article","isPartOf":{"@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/"},"author":{"name":"admin","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21"},"headline":"jQuery Image Resizing Plugin: ImgLiquid","datePublished":"2017-04-24T12:16:59+00:00","dateModified":"2021-06-05T09:12:36+00:00","mainEntityOfPage":{"@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/"},"wordCount":253,"commentCount":0,"publisher":{"@id":"https:\/\/www.railscarma.com\/#organization"},"image":{"@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage"},"thumbnailUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg","articleSection":["Technical Articles"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/","url":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/","name":"jQuery Image Resizing Plugin: ImgLiquid - RailsCarma - Ruby on Rails Development Company specializing in Offshore Development","isPartOf":{"@id":"https:\/\/www.railscarma.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage"},"image":{"@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage"},"thumbnailUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg","datePublished":"2017-04-24T12:16:59+00:00","dateModified":"2021-06-05T09:12:36+00:00","description":"ImgLiquid is a jQuery plugin for resizing the images so that these images can fit in the container. Features Optional Responsive (default settings are","breadcrumb":{"@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#primaryimage","url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg","contentUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2017\/04\/jQuery-Image-Resizing-Plugin-imgLiquid.jpg","width":800,"height":300},{"@type":"BreadcrumbList","@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.railscarma.com\/"},{"@type":"ListItem","position":2,"name":"jQuery Image Resizing Plugin: ImgLiquid"}]},{"@type":"WebSite","@id":"https:\/\/www.railscarma.com\/#website","url":"https:\/\/www.railscarma.com\/","name":"RailsCarma - Soci\u00e9t\u00e9 de d\u00e9veloppement Ruby on Rails sp\u00e9cialis\u00e9e dans le d\u00e9veloppement offshore","description":"RailsCarma est une soci\u00e9t\u00e9 de d\u00e9veloppement Ruby on Rails \u00e0 Bangalore. Nous sommes sp\u00e9cialis\u00e9s dans le d\u00e9veloppement offshore Ruby on Rails, bas\u00e9s aux \u00c9tats-Unis et en Inde. Embauchez des d\u00e9veloppeurs Ruby on Rails exp\u00e9riment\u00e9s pour une exp\u00e9rience Web ultime.","publisher":{"@id":"https:\/\/www.railscarma.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.railscarma.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/www.railscarma.com\/#organization","name":"RailsCarma","url":"https:\/\/www.railscarma.com\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png","contentUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png","width":200,"height":46,"caption":"RailsCarma"},"image":{"@id":"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/RailsCarma\/","https:\/\/x.com\/railscarma","https:\/\/www.linkedin.com\/company\/railscarma\/","https:\/\/myspace.com\/railscarma","https:\/\/in.pinterest.com\/railscarma\/","https:\/\/www.youtube.com\/channel\/UCx3Wil-aAnDARuatTEyMdpg"]},{"@type":"Person","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/5f2228a2dec7549056e709de6eb85d21","name":"administrateur","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/308867ca6c81f3aba146080c601000087180326f752c4116849ea9f514c6a4fa?s=96&d=mm&r=g","caption":"admin"},"sameAs":["https:\/\/www.railscarma.com\/hire-ruby-on-rails-developer\/"]}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/posts\/26582","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/comments?post=26582"}],"version-history":[{"count":0,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/posts\/26582\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/media\/31779"}],"wp:attachment":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/media?parent=26582"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/categories?post=26582"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/tags?post=26582"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}