Minimalist Responsive Image jQuery Plugin - responsive-image.js

File Size: 4 KB
Views Total: 364
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Minimalist Responsive Image jQuery Plugin - responsive-image.js

Just another jQuery based responsive image solution that loads the appropriate images for your cross-platform website to reduce network traffic and increase page load speed.

How to use it:

1. Add the jQuery responsive-image.js' script to the page, after you've added jQuery.

<script src="//"></script>
<script src="jquery.responsive-image.js"></script>

2. Insert an image into your web page and specify the image sources for different screen resolutions using HTML5 data attributes.

<img src="mobile.png"

3. Call the plugin on document ready and done.


4. Change the default breakpoints.


  // in pixels
  mobile : 400,
  phablet: 550,
  tablet : 750,
  desktop: 1000,

This awesome jQuery plugin is developed by rakuishi. For more Advanced Usages, please check the demo page or visit the official website.