{"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\/es\/blog\/articulos-tecnicos\/jquery-image-resizing-plugin-imgliquid\/","title":{"rendered":"jQuery Image Resizing Plugin: 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 is a jQuery plugin for resizing the images so that these images can fit in the container.\n<h3>Caracter\u00edsticas<\/h3>\n<ul style=\"font-family: \" montserrat\",sans-serif;\"=\"\">\n \t<li>Optional Responsive (default settings are \u2018off\u2019).<\/li>\n \t<li>Lightweight: less than 2KBs gzipped<\/li>\n \t<li>Fill\/Crop<\/li>\n \t<li>Align<\/li>\n \t<li>CallBacks<\/li>\n \t<li>Svg support<\/li>\n \t<li>Optional FadeIn Anim (default settings are \u2018off\u2019)<\/li>\n \t<li>Compatible with all browsers (Incl. ie6)<\/li>\n<\/ul>\n<h3>Why to use?<\/h3>\n<p align=\"justify\">It&#8217;s a very good plugin for us to be able to maintain high quality of the image specially at the time of resizing it. You must have witnessed that oftentimes when we upload an image of any shape, be it vertical or horizontal, its quality gets degraded significantly. Hence, in order to maintain the image quality at the time of resizing it, this plugin is quite useful.<\/p>\n\n<h3>How it works?<\/h3>\nIt basically works to just fit the image or resize it in a container. It can be customized as well. The easiest way to go about using it is including the JavaScript file and then calling it.\nFor example,\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;\">\/\/ assigning image <img decoding=\"async\" src=\"user.jpg\" alt=\"Person\"><\/div>\n<pre><code>\n$(document).ready(function() { $(\".imgLiquidFill\").imgLiquid(); \/\/ calling image liquid \n});<\/code><\/pre>\n<p align=\"justify\">It would hide the assigned image i.e. <strong>(<img decoding=\"async\" src=\"user.jpg\" alt=\"Person\">)<\/strong> and would fit the image in background of the div, resizing it.\nIf you choose &#8220;fill: true&#8221; while calling imageliquid function i.e. <strong>($(&#8220;.imgLiquidFill&#8221;).imgLiquid(fill: true))<\/strong>, it will fit the image in the background of the div. Similarly, if you choose &#8220;<strong>fill: false<\/strong>&#8220;, then you can see the image in the original manner the way you had uploaded it. In both ways, the image quality would be maintained.<\/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\">Suscr\u00edbete para recibir las \u00faltimas actualizaciones<\/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=\"cargador\"><\/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=\"ef492fa981\">\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=\"Direcci\u00f3n de correo electr\u00f3nico\">\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=\"Nombre\">\r\n<\/p>\r\n<p>\r\n    <input type=\"submit\" id=\"invisible\" class=\"sib-default-btn\" value=\"Suscribir\">\r\n<\/p>\t\t\t\t<\/div>\n\t\t\t<input type=\"hidden\" name=\"trp-form-language\" value=\"es\"\/><\/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\">Art\u00edculos Relacionados<\/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=\"Gema Kaminari\" href=\"https:\/\/www.railscarma.com\/es\/blog\/articulos-tecnicos\/gema-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=\"gema 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=\"Gema Kaminari\" href=\"https:\/\/www.railscarma.com\/es\/blog\/articulos-tecnicos\/gema-kaminari\/?related_post_from=37277\">\r\n        Gema Kaminari  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"\u00bfPor qu\u00e9 contratar desarrolladores Ruby on Rails en 2026?\" href=\"https:\/\/www.railscarma.com\/es\/blog\/ror\/por-que-contratar-desarrolladores-de-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=\"por qu\u00e9 contratar desarrolladores de 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=\"\u00bfPor qu\u00e9 contratar desarrolladores Ruby on Rails en 2026?\" href=\"https:\/\/www.railscarma.com\/es\/blog\/ror\/por-que-contratar-desarrolladores-de-ruby-on-rails\/?related_post_from=30627\">\r\n        \u00bfPor qu\u00e9 contratar desarrolladores 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=\"Importancia de la arquitectura de software en el desarrollo de software empresarial\" href=\"https:\/\/www.railscarma.com\/es\/blog\/ror\/importancia-de-la-arquitectura-de-software-en-el-desarrollo-de-software-empresarial\/?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=\"Importancia de la arquitectura de software en el desarrollo de software empresarial\" 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=\"Importancia de la arquitectura de software en el desarrollo de software empresarial\" href=\"https:\/\/www.railscarma.com\/es\/blog\/ror\/importancia-de-la-arquitectura-de-software-en-el-desarrollo-de-software-empresarial\/?related_post_from=36250\">\r\n        Importancia de la arquitectura de software en el desarrollo de software empresarial  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Ruby IDE: los mejores IDE para el desarrollo de Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/es\/blog\/ror\/ruby-ide-las-mejores-ideas-para-el-desarrollo-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=\"MEJORES IDES PARA EL DESARROLLO 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: los mejores IDE para el desarrollo de Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/es\/blog\/ror\/ruby-ide-las-mejores-ideas-para-el-desarrollo-de-ruby-on-rails\/?related_post_from=36125\">\r\n        Ruby IDE: los mejores IDE para el desarrollo de 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 is a jQuery plugin for resizing the images so that these images can fit in the container. Features Optional Responsive (default settings are \u2018off\u2019). Lightweight: less than 2KBs gzipped Fill\/Crop Align CallBacks Svg support Optional FadeIn Anim (default settings are \u2018off\u2019) Compatible with all browsers (Incl. ie6) Why to use? It&#8217;s a very good &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/www.railscarma.com\/es\/blog\/how-to-build-a-scalable-saas-platform-using-ruby-on-rails\/\"> <span class=\"screen-reader-text\">C\u00f3mo crear una plataforma SaaS escalable con Ruby on Rails<\/span> Leer m\u00e1s \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\/es\/blog\/articulos-tecnicos\/jquery-image-resizing-plugin-imgliquid\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\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\/es\/blog\/articulos-tecnicos\/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=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minuto\" \/>\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\":\"es\",\"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\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@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\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.railscarma.com\/#organization\",\"name\":\"RailsCarma\",\"url\":\"https:\/\/www.railscarma.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@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\":\"es\",\"@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\/es\/blog\/articulos-tecnicos\/jquery-image-resizing-plugin-imgliquid\/","og_locale":"es_ES","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\/es\/blog\/articulos-tecnicos\/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":{"Escrito por":"admin","Tiempo de lectura":"1 minuto"},"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":"es","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":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/"]}]},{"@type":"ImageObject","inLanguage":"es","@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 - Empresa de desarrollo Ruby on Rails especializada en desarrollo offshore","description":"RailsCarma es una empresa de desarrollo de Ruby on Rails en Bangalore. Nos especializamos en el desarrollo offshore de Ruby on Rails con sede en EE. UU. e India. Contrate desarrolladores experimentados de Ruby on Rails para disfrutar de la mejor experiencia web.","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":"es"},{"@type":"Organization","@id":"https:\/\/www.railscarma.com\/#organization","name":"RielesCarma","url":"https:\/\/www.railscarma.com\/","logo":{"@type":"ImageObject","inLanguage":"es","@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":"administraci\u00f3n","image":{"@type":"ImageObject","inLanguage":"es","@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\/es\/wp-json\/wp\/v2\/posts\/26582","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/comments?post=26582"}],"version-history":[{"count":0,"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/posts\/26582\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/media\/31779"}],"wp:attachment":[{"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/media?parent=26582"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/categories?post=26582"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.railscarma.com\/es\/wp-json\/wp\/v2\/tags?post=26582"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}