jQuery Plugin For Stretching Images To Fill Container - imagefill.js

imagefill.js is a simple yet useful jQuery plugin for responsive design that automatically stretches images to fill their containers or be centered. 

See also:

• jQuery Plugin For Stretching Image - fitpic.js
• Resize Images To Fit In A Container - imgLiquid

More Examples:

• Responsive Grid Example
• With Packery Example Example

Basic Usage:

1. Create the html

<div class="container"><img src="1.jpg" alt="" /></div>

2. Include jQuery library on the web page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 

3. Include jQuery imagefill.js and required jQuery ImageLoaded Plugin on the page

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/2.1.0/jquery.imagesloaded.min.js"></script> 
<script src="js/jquery-imagefill.js"></script> 

4. Call the plugin and done

$('.container').imagefill();

Change logs:

2015-04-29

• target specific img fixes

2014-07-31

• fix merge conflicts

---

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