{"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-plugin-for-storleksandring-av-bild-imgliquid","status":"publish","type":"post","link":"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/jquery-plugin-for-storleksandring-av-bild-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 \u00e4r ett jQuery-plugin f\u00f6r att \u00e4ndra storlek p\u00e5 bilderna s\u00e5 att dessa bilder f\u00e5r plats i beh\u00e5llaren.\n<h3>Funktioner<\/h3>\n<ul style=\"font-family: \" montserrat\",sans-serif;\"=\"\">\n \t<li>Valfritt Responsive (standardinst\u00e4llningarna \u00e4r &quot;av&quot;).<\/li>\n \t<li>L\u00e4ttvikt: mindre \u00e4n 2KBs gzippad<\/li>\n \t<li>Fyll\/besk\u00e4r<\/li>\n \t<li>Justera<\/li>\n \t<li>\u00c5teruppringningar<\/li>\n \t<li>Svg st\u00f6d<\/li>\n \t<li>Valfritt FadeIn Anim (standardinst\u00e4llningarna \u00e4r &#039;av&#039;)<\/li>\n \t<li>Kompatibel med alla webbl\u00e4sare (inkl. ie6)<\/li>\n<\/ul>\n<h3>Varf\u00f6r anv\u00e4nda?<\/h3>\n<p align=\"justify\">Det \u00e4r ett mycket bra plugin f\u00f6r att vi ska kunna bibeh\u00e5lla h\u00f6g kvalitet p\u00e5 bilden speciellt vid tidpunkten f\u00f6r storleks\u00e4ndring. Du m\u00e5ste ha sett att n\u00e4r vi laddar upp en bild av vilken form som helst, vare sig den \u00e4r vertikal eller horisontell, s\u00e5 f\u00f6rs\u00e4mras dess kvalitet avsev\u00e4rt. D\u00e4rf\u00f6r, f\u00f6r att bibeh\u00e5lla bildkvaliteten vid tidpunkten f\u00f6r storleks\u00e4ndring, \u00e4r detta plugin ganska anv\u00e4ndbart.<\/p>\n\n<h3>Hur det fungerar?<\/h3>\nDet fungerar i princip att bara passa bilden eller \u00e4ndra storlek p\u00e5 den i en beh\u00e5llare. Den kan ocks\u00e5 anpassas. Det enklaste s\u00e4ttet att anv\u00e4nda den \u00e4r att inkludera JavaScript-filen och sedan anropa den. Till exempel,\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;\">\/\/ tilldela bild <img decoding=\"async\" src=\"user.jpg\" alt=\"Person\"><\/div>\n<pre><code>\n$(document).ready(function() { $(&quot;.imgLiquidFill&quot;).imgLiquid(); \/\/ anropar bild flytande });<\/code><\/pre>\n<p align=\"justify\">Det skulle d\u00f6lja den tilldelade bilden, dvs <strong>(<img decoding=\"async\" src=\"user.jpg\" alt=\"Person\">)<\/strong> och skulle passa bilden i bakgrunden av div, \u00e4ndra storlek p\u00e5 den. Om du v\u00e4ljer &quot;fill: true&quot; medan du anropar imageliquid-funktionen, dvs <strong>($(\u201c.imgLiquidFill\u201d).imgLiquid(fill: true))<\/strong>, kommer det att passa bilden i bakgrunden av div. P\u00e5 samma s\u00e4tt, om du v\u00e4ljer &quot;<strong>fylla: falskt<\/strong>&quot;, d\u00e5 kan du se bilden p\u00e5 det ursprungliga s\u00e4ttet som du laddade upp den. P\u00e5 b\u00e5da s\u00e4tten skulle bildkvaliteten bibeh\u00e5llas.<\/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\">Prenumerera f\u00f6r de senaste uppdateringarna<\/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=\"lastare\"><\/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=\"8dced0a366\">\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=\"E-postadress\">\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=\"namn\">\r\n<\/p>\r\n<p>\r\n    <input type=\"submit\" id=\"invisible\" class=\"sib-default-btn\" value=\"Prenumerera\">\r\n<\/p>\t\t\t\t<\/div>\n\t\t\t<input type=\"hidden\" name=\"trp-form-language\" value=\"sv\"\/><\/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\">relaterade inl\u00e4gg<\/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=\"Kaminari Gem\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/kaminari-parla\/?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=\"kaminari p\u00e4rla\" 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=\"Kaminari Gem\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/tekniska-artiklar\/kaminari-parla\/?related_post_from=37277\">\r\n        Kaminari Gem  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Varf\u00f6r anst\u00e4lla Ruby on Rails-utvecklare 2026?\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/varfor-anlita-utvecklare-av-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=\"varf\u00f6r anlita utvecklare av ruby on rails 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=\"Varf\u00f6r anst\u00e4lla Ruby on Rails-utvecklare 2026?\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/varfor-anlita-utvecklare-av-ruby-on-rails\/?related_post_from=30627\">\r\n        Varf\u00f6r anst\u00e4lla Ruby on Rails-utvecklare 2026?  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/vikten-av-mjukvaruarkitektur-i-foretagsutveckling-av-programvara\/?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=\"Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara\" 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=\"Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/vikten-av-mjukvaruarkitektur-i-foretagsutveckling-av-programvara\/?related_post_from=36250\">\r\n        Betydelsen av mjukvaruarkitektur vid utveckling av f\u00f6retagsmjukvara  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Ruby IDE: De b\u00e4sta IDE:erna f\u00f6r Ruby on Rails Development\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/ruby-ide-de-basta-ideerna-for-ruby-on-rails-utveckling\/?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=\"B\u00c4STA ID\u00c9ER F\u00d6R UTVECKLING AV RUBY ON RAIL\" 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: De b\u00e4sta IDE:erna f\u00f6r Ruby on Rails Development\" href=\"https:\/\/www.railscarma.com\/sv\/blogg\/ror\/ruby-ide-de-basta-ideerna-for-ruby-on-rails-utveckling\/?related_post_from=36125\">\r\n        Ruby IDE: De b\u00e4sta IDE:erna f\u00f6r Ruby on Rails Development  <\/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\/sv\/blogg\/how-to-build-a-scalable-saas-platform-using-ruby-on-rails\/\"> <span class=\"screen-reader-text\">Hur man bygger en skalbar SaaS-plattform med Ruby on Rails<\/span> L\u00e4s mer \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\/sv\/blogg\/tekniska-artiklar\/jquery-plugin-for-storleksandring-av-bild-imgliquid\/\" \/>\n<meta property=\"og:locale\" content=\"sv_SE\" \/>\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\/sv\/blogg\/tekniska-artiklar\/jquery-plugin-for-storleksandring-av-bild-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=\"Skriven av\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Ber\u00e4knad l\u00e4stid\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minut\" \/>\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\":\"sv-SE\",\"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\":\"sv-SE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@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\":\"sv-SE\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.railscarma.com\/#organization\",\"name\":\"RailsCarma\",\"url\":\"https:\/\/www.railscarma.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@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\":\"sv-SE\",\"@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 specialiserat p\u00e5 offshoreutveckling","description":"ImgLiquid \u00e4r ett jQuery-plugin f\u00f6r att \u00e4ndra storlek p\u00e5 bilderna s\u00e5 att dessa bilder f\u00e5r plats i beh\u00e5llaren. Funktioner Valfri Responsive (standardinst\u00e4llningar \u00e4r","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\/sv\/blogg\/tekniska-artiklar\/jquery-plugin-for-storleksandring-av-bild-imgliquid\/","og_locale":"sv_SE","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\/sv\/blogg\/tekniska-artiklar\/jquery-plugin-for-storleksandring-av-bild-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":{"Skriven av":"admin","Ber\u00e4knad l\u00e4stid":"1 minut"},"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":"sv-SE","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 specialiserat p\u00e5 offshoreutveckling","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 \u00e4r ett jQuery-plugin f\u00f6r att \u00e4ndra storlek p\u00e5 bilderna s\u00e5 att dessa bilder f\u00e5r plats i beh\u00e5llaren. Funktioner Valfri Responsive (standardinst\u00e4llningar \u00e4r","breadcrumb":{"@id":"https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/#breadcrumb"},"inLanguage":"sv-SE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.railscarma.com\/blog\/technical-articles\/jquery-image-resizing-plugin-imgliquid\/"]}]},{"@type":"ImageObject","inLanguage":"sv-SE","@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 specialiserat p\u00e5 Offshore Development","description":"RailsCarma \u00e4r ett Ruby on Rails Development Company i Bangalore. Vi \u00e4r specialiserade p\u00e5 Offshore Ruby on Rails Development baserat i USA och Indien. Anst\u00e4ll erfarna Ruby on Rails-utvecklare f\u00f6r den ultimata webbupplevelsen.","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":"sv-SE"},{"@type":"Organization","@id":"https:\/\/www.railscarma.com\/#organization","name":"RailsCarma","url":"https:\/\/www.railscarma.com\/","logo":{"@type":"ImageObject","inLanguage":"sv-SE","@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":"administration","image":{"@type":"ImageObject","inLanguage":"sv-SE","@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\/sv\/wp-json\/wp\/v2\/posts\/26582","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/comments?post=26582"}],"version-history":[{"count":0,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/posts\/26582\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/media\/31779"}],"wp:attachment":[{"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/media?parent=26582"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/categories?post=26582"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.railscarma.com\/sv\/wp-json\/wp\/v2\/tags?post=26582"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}